From f6c01d35a8d24ea579eaee88a122b5de2b41a6c0 Mon Sep 17 00:00:00 2001 From: samy Date: Wed, 15 May 2019 11:47:17 +0200 Subject: [PATCH] v2 --- .gitignore | 1 + README.md | 4 - css/style.css | 15 +-- index.html | 12 +- js/canvas.js | 119 ++++++------------- js/classes.js | 58 --------- js/database.js | 215 --------------------------------- js/main.js | 317 +++---------------------------------------------- js/world.js | 59 +++++++++ ts/canvas.ts | 39 ++++++ ts/main.ts | 20 ++++ ts/world.ts | 56 +++++++++ tsconfig.json | 9 ++ 13 files changed, 247 insertions(+), 677 deletions(-) create mode 100644 .gitignore delete mode 100644 README.md delete mode 100644 js/classes.js delete mode 100644 js/database.js create mode 100644 js/world.js create mode 100644 ts/canvas.ts create mode 100644 ts/main.ts create mode 100644 ts/world.ts create mode 100644 tsconfig.json diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..600d2d3 --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +.vscode \ No newline at end of file diff --git a/README.md b/README.md deleted file mode 100644 index fa6440e..0000000 --- a/README.md +++ /dev/null @@ -1,4 +0,0 @@ -# procedural_map -An algorithm to create procedurally generated maps - -Please use F5 to create a new map diff --git a/css/style.css b/css/style.css index cef5eb4..02c9d7c 100644 --- a/css/style.css +++ b/css/style.css @@ -1,19 +1,12 @@ html, body { - width : 100%; - height : 100%; - margin : 0; - display : flex; + width: 100%; + height: 100%; + margin: 0; + display: flex; background-image: url('../img/back.png'); - overflow : hidden; box-shadow: inset 0px 0px 25px 0px #000; } canvas { margin : auto; box-shadow: 0px 0px 10px 0px #000; -} - -.reload { - top: 5px; - left: 3px; - position: absolute; } \ No newline at end of file diff --git a/index.html b/index.html index e3c7857..041a05f 100644 --- a/index.html +++ b/index.html @@ -2,20 +2,14 @@ - Procedural generation - - - + - - - + + \ No newline at end of file diff --git a/js/canvas.js b/js/canvas.js index 818137b..4aac934 100644 --- a/js/canvas.js +++ b/js/canvas.js @@ -1,84 +1,41 @@ -class CanvasDisplay { - constructor (parent, world) { +class Canvas { + constructor(parent, world) { this.canvas = document.createElement('canvas'); - this.gridLength = world.size; - this.scale = 512 / world.size; - this.canvas.width = this.scale * this.gridLength; - this.canvas.height = this.scale * this.gridLength; - parent.appendChild(this.canvas); - this.cx = this.canvas.getContext("2d"); - this.cx.imageSmoothingEnabled = false; + this.cx = this.canvas.getContext("2d", { alpha: false }); + this.zoom = 4; + this.draw = () => { + this.cx.fillStyle = '#033'; + this.cx.strokeStyle = "#0f0"; + this.cx.fillRect(0, 0, this.canvas.width, this.canvas.height); + for (let x = 0; x < this.world.size; x++) + for (let y = 0; y < this.world.size; y++) + this.cx.strokeRect(x * 8 + 0.5, y * 8 + 0.5, 7, 7); + this.cx.fillStyle = "#888"; + this.cx.strokeStyle = "#fff"; + this.world.rooms.forEach((room, pos) => { + var posNum = pos.split(',', 2); + var posX = (+posNum[0]) * 8 + this.world.size / 2 * 8; + var posY = (+posNum[1]) * 8 + this.world.size / 2 * 8; + this.cx.fillRect(posX, posY, 8, 8); + this.cx.strokeRect(posX + 0.5, posY + 0.5, 7, 7); + room.forEach(door => { + if (door === "top") + this.cx.fillRect(posX + 3, posY + 7, 2, 1); + if (door === "right") + this.cx.fillRect(posX + 7, posY + 3, 1, 2); + if (door === "bottom") + this.cx.fillRect(posX + 3, posY, 2, 1); + if (door === "left") + this.cx.fillRect(posX, posY + 3, 1, 2); + }); + }); + }; + this.canvas.width = world.size * 8 * this.zoom; + this.canvas.height = world.size * 8 * this.zoom; + parent.appendChild(this.canvas); + this.cx.scale(this.zoom, -this.zoom); + this.cx.translate(0, -world.size * 8); + this.cx.imageSmoothingEnabled = false; this.world = world; - - this.cx.translate(0, this.canvas.height/2); - this.cx.scale(1, -1); - this.cx.translate(0, -this.canvas.height/2); - } -} - -CanvasDisplay.prototype.draw = function() { - this.drawGrid(); - this.drawRooms(); -}; - -CanvasDisplay.prototype.drawGrid = function() { - this.cx.fillStyle = '#033'; - this.cx.fillRect(0, 0, this.canvas.width, this.canvas.height); - for (let x = 0; x < this.canvas.width; x += this.scale) { - for (let y = 0; y < this.canvas.height; y += this.scale) { - this.cx.strokeStyle = "lime"; - this.cx.strokeRect(x, y, this.scale, this.scale); - } } -}; - -CanvasDisplay.prototype.drawRooms = function() { - this.world.grid.forEach(cell => { - var posX = cell.pos.x*this.scale + this.canvas.width/2; - var posY = cell.pos.y*this.scale + this.canvas.width/2; - - var color = "grey"; - // if (cell.type === 0) { color = "red"; } - // else if (cell.type === 1) { color = "blue"; } - // else { color = "grey"; } - - //floor - if (cell.top || cell.right || cell.bottom || cell.left) { - this.cx.fillStyle = color; - this.cx.fillRect(posX, posY, this.scale, this.scale); - } - //walls && doors - if (cell.top) { - this.cx.fillStyle = "#fff"; - this.cx.fillRect(posX, posY + 0.875*this.scale, this.scale, this.scale/8); - if (cell.top instanceof Door) { - this.cx.fillStyle = color; - this.cx.fillRect(posX + 0.375*this.scale, posY + 0.875*this.scale, this.scale/4, this.scale/8); - } - } - if (cell.right) { - this.cx.fillStyle = "#fff"; - this.cx.fillRect(posX + 0.875*this.scale, posY, this.scale/8, this.scale); - if (cell.right instanceof Door) { - this.cx.fillStyle = color; - this.cx.fillRect(posX + 0.875*this.scale, posY + 0.375*this.scale, this.scale/8, this.scale/4); - } - } - if (cell.bottom) { - this.cx.fillStyle = "#fff"; - this.cx.fillRect(posX, posY, this.scale, this.scale/8); - if (cell.bottom instanceof Door) { - this.cx.fillStyle = color; - this.cx.fillRect(posX + 0.375*this.scale, posY, this.scale/4, this.scale/8); - } - } - if (cell.left) { - this.cx.fillStyle = "#fff"; - this.cx.fillRect(posX, posY, this.scale/8, this.scale); - if (cell.left instanceof Door) { - this.cx.fillStyle = color; - this.cx.fillRect(posX, posY + 0.375*this.scale, this.scale/8, this.scale/4); - } - } - }); -}; \ No newline at end of file +} diff --git a/js/classes.js b/js/classes.js deleted file mode 100644 index fef0bc6..0000000 --- a/js/classes.js +++ /dev/null @@ -1,58 +0,0 @@ -class V2D { - constructor (x, y) { - this.x = x; - this.y = y; - } -} - -class Cell { - constructor (pos, top, right, bottom, left) { - this.pos = pos; - this.top = top; - this.right = right; - this.bottom = bottom; - this.left = left; - } -} - -class Door { - constructor (relPos, side, state, absPos) { - this.relPos = relPos; - this.side = side; - this.state = state; - this.absPos = absPos; - } -} - -class Wall { - constructor (relPos, side, absPos) { - this.relPos = relPos; - this.side = side; - this.absPos = absPos; - } -} - -class Room { - constructor(walls, doors, absPos) { - this.walls = walls; - this.doors = doors; - this.absPos = absPos; - } -} - -class WorldData { - constructor (bossRoom, campRooms, rooms, size) { - this.bossRoom = bossRoom; - this.campRooms = campRooms; - this.rooms = rooms; - this.size = size; - } -} - -class World { - constructor (rooms, grid, size) { - this.rooms = rooms; - this.grid = grid; - this.size = size; - } -} \ No newline at end of file diff --git a/js/database.js b/js/database.js deleted file mode 100644 index 39a7ebb..0000000 --- a/js/database.js +++ /dev/null @@ -1,215 +0,0 @@ -const bossRoom = new Room ( - [ - new Wall(new V2D(0, 1), 'top', new V2D(0, 1)), - new Wall(new V2D(1, 1), 'top', new V2D(1, 1)), - new Wall(new V2D(2, 1), 'top', new V2D(2, 1)), - new Wall(new V2D(2, 0), 'right', new V2D(2, 0)), - new Wall(new V2D(2, 1), 'right', new V2D(2, 1)), - new Wall(new V2D(0, 0), 'bottom', new V2D(0, 0)), - new Wall(new V2D(1, 0), 'bottom', new V2D(1, 0)), - new Wall(new V2D(2, 0), 'bottom', new V2D(2, 0)), - new Wall(new V2D(0, 1), 'left', new V2D(0, 1)), - ], - [ - new Door(new V2D(0, 0), 'left', false, new V2D(0, 0)) - ], - new V2D(0, 0) -); - -//room 00 --> 0f - -const room00 = new Room ( - [ - new Wall(new V2D(0, 0), 'top'), - new Wall(new V2D(0, 0), 'right'), - new Wall(new V2D(0, 0), 'bottom'), - new Wall(new V2D(0, 0), 'left'), - ], - [] -); -const room01 = new Room ( - [ - new Wall(new V2D(0, 0), 'right'), - new Wall(new V2D(0, 0), 'bottom'), - new Wall(new V2D(0, 0), 'left'), - ], - [ - new Door(new V2D(0, 0), 'top') - ] -); -const room02 = new Room ( - [ - new Wall(new V2D(0, 0), 'top'), - new Wall(new V2D(0, 0), 'bottom'), - new Wall(new V2D(0, 0), 'left'), - ], - [ - new Door(new V2D(0, 0), 'right') - ] -); -const room03 = new Room ( - [ - new Wall(new V2D(0, 0), 'top'), - new Wall(new V2D(0, 0), 'right'), - new Wall(new V2D(0, 0), 'left'), - ], - [ - new Door(new V2D(0, 0), 'bottom') - ] -); -const room04 = new Room ( - [ - new Wall(new V2D(0, 0), 'top'), - new Wall(new V2D(0, 0), 'right'), - new Wall(new V2D(0, 0), 'bottom'), - ], - [ - new Door(new V2D(0, 0), 'left') - ] -); -const room05 = new Room ( - [ - new Wall(new V2D(0, 0), 'bottom'), - new Wall(new V2D(0, 0), 'left'), - ], - [ - new Door(new V2D(0, 0), 'top'), - new Door(new V2D(0, 0), 'right') - ] -); -const room06 = new Room ( - [ - new Wall(new V2D(0, 0), 'top'), - new Wall(new V2D(0, 0), 'left'), - ], - [ - new Door(new V2D(0, 0), 'right'), - new Door(new V2D(0, 0), 'bottom') - ] -); -const room07 = new Room ( - [ - new Wall(new V2D(0, 0), 'top'), - new Wall(new V2D(0, 0), 'right'), - ], - [ - new Door(new V2D(0, 0), 'bottom'), - new Door(new V2D(0, 0), 'left') - ] -); -const room08 = new Room ( - [ - new Wall(new V2D(0, 0), 'right'), - new Wall(new V2D(0, 0), 'bottom'), - ], - [ - new Door(new V2D(0, 0), 'top'), - new Door(new V2D(0, 0), 'left') - ] -); -const room09 = new Room ( - [ - new Wall(new V2D(0, 0), 'right'), - new Wall(new V2D(0, 0), 'left'), - ], - [ - new Door(new V2D(0, 0), 'top'), - new Door(new V2D(0, 0), 'bottom') - ] -); -const room0a = new Room ( - [ - new Wall(new V2D(0, 0), 'top'), - new Wall(new V2D(0, 0), 'bottom'), - ], - [ - new Door(new V2D(0, 0), 'right'), - new Door(new V2D(0, 0), 'left') - ] -); -const room0b = new Room ( - [ - new Wall(new V2D(0, 0), 'left'), - ], - [ - new Door(new V2D(0, 0), 'top'), - new Door(new V2D(0, 0), 'right'), - new Door(new V2D(0, 0), 'bottom') - ] -); -const room0c = new Room ( - [ - new Wall(new V2D(0, 0), 'top'), - ], - [ - new Door(new V2D(0, 0), 'right'), - new Door(new V2D(0, 0), 'bottom'), - new Door(new V2D(0, 0), 'left') - ] -); -const room0d = new Room ( - [ - new Wall(new V2D(0, 0), 'right'), - ], - [ - new Door(new V2D(0, 0), 'top'), - new Door(new V2D(0, 0), 'bottom'), - new Door(new V2D(0, 0), 'left') - ] -); -const room0e = new Room ( - [ - new Wall(new V2D(0, 0), 'bottom'), - ], - [ - new Door(new V2D(0, 0), 'top'), - new Door(new V2D(0, 0), 'right'), - new Door(new V2D(0, 0), 'left') - ] -); -const room0f = new Room ( - [], - [ - new Door(new V2D(0, 0), 'top'), - new Door(new V2D(0, 0), 'right'), - new Door(new V2D(0, 0), 'bottom'), - new Door(new V2D(0, 0), 'left') - ] -); - -//room 10 --> 1f - -const room10 = new Room ( - [ - new Wall(new V2D(0, 1), 'top'), - new Wall(new V2D(1, 1), 'top'), - new Wall(new V2D(1, 0), 'right'), - new Wall(new V2D(1, 1), 'right'), - new Wall(new V2D(0, 0), 'bottom'), - new Wall(new V2D(1, 0), 'bottom'), - new Wall(new V2D(0, 0), 'left'), - new Wall(new V2D(0, 1), 'left') - ], - [] -); -const room11 = new Room ( - [ - new Wall(new V2D(0, 0), 'top'), - new Wall(new V2D(0, 0), 'bottom') - ], - [ - new Door(new V2D(0, 0), 'right'), - new Door(new V2D(0, 0), 'left') - ] -); - -const worldData01 = new WorldData ( - bossRoom, - [], - [ - room00, room01, room02, room03, room04, room05, room06, room07, - room08, room09, room0a, room0b, room0c, room0d, room0e, room0f, - room10, room11 - ], - 16 -); \ No newline at end of file diff --git a/js/main.js b/js/main.js index 2c45c37..15838ac 100644 --- a/js/main.js +++ b/js/main.js @@ -1,299 +1,18 @@ -var generateWorld = worldData => { - - var rooms = new Array(); - var usedSpace = new Map(); - usedSpace = setBorderUsedSpace(worldData); - - var firstRoom = new Room(worldData.bossRoom.walls, worldData.bossRoom.doors, worldData.bossRoom.absPos); - var firstDoor = new Door( - worldData.bossRoom.doors[0].relPos, worldData.bossRoom.doors[0].side, - worldData.bossRoom.doors[0].state, worldData.bossRoom.doors[0].absPos - ); - rooms.push(firstRoom); - usedSpace = updateUsedSpace(usedSpace, firstRoom); - - var addNextRoom = (worldData, lastRoom, lastDoor) => { - - var newRoom = generateNewRoom(worldData, usedSpace, lastRoom, lastDoor); - rooms.push(newRoom); - usedSpace = closeNeighborDoors(usedSpace, newRoom); - usedSpace = updateUsedSpace(usedSpace, newRoom); - - newRoom.doors.forEach(door => { - if (door.state) { - door.state = false; - addNextRoom(worldData, newRoom, door); - } - }); - } - addNextRoom(worldData, firstRoom, firstDoor); - - return new World(rooms, usedSpace, worldData.size); -} -var generateNewRoom = (worldData, usedSpace, lastRoom, lastDoor) => { - - var potentialRooms = new Array(); - worldData.rooms.forEach(room => { - room.doors.forEach(door => { - if (door.side === reverseDoorSide(lastDoor.side)) { - potentialRooms.push(room); - } - }); - }); - var magicNumber = Math.floor(Math.random() * potentialRooms.length) - var newRoom = makeNewRoom( - potentialRooms[magicNumber].walls, - potentialRooms[magicNumber].doors - ); - - var potentialDoors = new Array(); - newRoom.doors.forEach(door => { - if (door.side === reverseDoorSide(lastDoor.side)) { - potentialDoors.push(door) - } - }); - var AnotherMagicNumber = Math.floor(Math.random() * potentialDoors.length) - var newDoor = new Door( - potentialDoors[AnotherMagicNumber].relPos, - potentialDoors[AnotherMagicNumber].side, - false - ) - newRoom.absPos = calculateNewRoomAbsPos(newRoom, newDoor, lastRoom, lastDoor); - - calculateAbsPos(newRoom, newRoom.walls); - calculateAbsPos(newRoom, newRoom.doors); - - if (checkUsedSpace(newRoom, usedSpace) && checkNeighborCells(newRoom, usedSpace)) { - newRoom = closeNewDoor(newRoom, newDoor); - return newRoom; - } else { - return generateNewRoom(worldData, usedSpace, lastRoom, lastDoor); - } -} -var setBorderUsedSpace = worldData => { - var limit = worldData.size / 2 + 1; - var newUsedSpace = new Map(); - for (let x = -limit; x < limit; x++) { - for (let y = -limit; y < limit; y++) { - if (x === -limit || x === limit - 1 || y === -limit || y === limit - 1) { - newUsedSpace.set(x + ", " + y, - new Cell(new V2D(x, y), new Wall(new V2D(0, 0), 'top', new V2D(x, y)), new Wall(new V2D(0, 0), 'right', new V2D(x, y)), - new Wall(new V2D(0, 0), 'bottom', new V2D(x, y)), new Wall(new V2D(0, 0), 'left', new V2D(x, y)))); - } else { - newUsedSpace.set(x + ", " + y, new Cell(new V2D(x, y))); - } - } - } - return newUsedSpace; -} -var updateUsedSpace = (usedSpace, newRoom) => { - var newUsedSpace = new Map(usedSpace); - newRoom.walls.forEach(wall => { - if (wall.side === "top") { - newUsedSpace.set(wall.absPos.x + ", " + wall.absPos.y, - new Cell(newUsedSpace.get(wall.absPos.x + ", " + wall.absPos.y).pos, wall, newUsedSpace.get(wall.absPos.x + ", " + wall.absPos.y).right, - newUsedSpace.get(wall.absPos.x + ", " + wall.absPos.y).bottom, newUsedSpace.get(wall.absPos.x + ", " + wall.absPos.y).left)); - } else if (wall.side === "right") { - newUsedSpace.set(wall.absPos.x + ", " + wall.absPos.y, - new Cell(newUsedSpace.get(wall.absPos.x + ", " + wall.absPos.y).pos, newUsedSpace.get(wall.absPos.x + ", " + wall.absPos.y).top, wall, - newUsedSpace.get(wall.absPos.x + ", " + wall.absPos.y).bottom, newUsedSpace.get(wall.absPos.x + ", " + wall.absPos.y).left)); - } else if (wall.side === "bottom") { - newUsedSpace.set(wall.absPos.x + ", " + wall.absPos.y, - new Cell(newUsedSpace.get(wall.absPos.x + ", " + wall.absPos.y).pos, newUsedSpace.get(wall.absPos.x + ", " + wall.absPos.y).top, - newUsedSpace.get(wall.absPos.x + ", " + wall.absPos.y).right, wall, newUsedSpace.get(wall.absPos.x + ", " + wall.absPos.y).left)); - } else if (wall.side === "left") { - newUsedSpace.set(wall.absPos.x + ", " + wall.absPos.y, - new Cell(newUsedSpace.get(wall.absPos.x + ", " + wall.absPos.y).pos, newUsedSpace.get(wall.absPos.x + ", " + wall.absPos.y).top, - newUsedSpace.get(wall.absPos.x + ", " + wall.absPos.y).right, newUsedSpace.get(wall.absPos.x + ", " + wall.absPos.y).bottom, wall)); - } - }); - newRoom.doors.forEach(door => { - if (door.side === "top") { - newUsedSpace.set(door.absPos.x + ", " + door.absPos.y, - new Cell(newUsedSpace.get(door.absPos.x + ", " + door.absPos.y).pos, door, newUsedSpace.get(door.absPos.x + ", " + door.absPos.y).right, - newUsedSpace.get(door.absPos.x + ", " + door.absPos.y).bottom, newUsedSpace.get(door.absPos.x + ", " + door.absPos.y).left)); - } else if (door.side === "right") { - newUsedSpace.set(door.absPos.x + ", " + door.absPos.y, - new Cell(newUsedSpace.get(door.absPos.x + ", " + door.absPos.y).pos, newUsedSpace.get(door.absPos.x + ", " + door.absPos.y).top, door, - newUsedSpace.get(door.absPos.x + ", " + door.absPos.y).bottom, newUsedSpace.get(door.absPos.x + ", " + door.absPos.y).left)); - } else if (door.side === "bottom") { - newUsedSpace.set(door.absPos.x + ", " + door.absPos.y, - new Cell(newUsedSpace.get(door.absPos.x + ", " + door.absPos.y).pos, newUsedSpace.get(door.absPos.x + ", " + door.absPos.y).top, - newUsedSpace.get(door.absPos.x + ", " + door.absPos.y).right, door, newUsedSpace.get(door.absPos.x + ", " + door.absPos.y).left)); - } else if (door.side === "left") { - newUsedSpace.set(door.absPos.x + ", " + door.absPos.y, - new Cell(newUsedSpace.get(door.absPos.x + ", " + door.absPos.y).pos, newUsedSpace.get(door.absPos.x + ", " + door.absPos.y).top, - newUsedSpace.get(door.absPos.x + ", " + door.absPos.y).right, newUsedSpace.get(door.absPos.x + ", " + door.absPos.y).bottom, door)); - } - }); - return newUsedSpace; -} -var reverseDoorSide = doorSide => { - if (doorSide === "top") { - return "bottom"; - } else if (doorSide === "right") { - return "left"; - } else if (doorSide === "bottom") { - return "top"; - } else if (doorSide === "left") { - return "right"; - } -} -var calculateNewRoomAbsPos = (room, door, lastRoom, lastDoor) => { - var newRoom = room; - door.absPos = new V2D(undefined, undefined); - newRoom.absPos = new V2D(undefined, undefined); - if (door.side === 'top') { - door.absPos.x = lastDoor.absPos.x; - door.absPos.y = lastDoor.absPos.y - 1; - } else if (door.side === 'right') { - door.absPos.x = lastDoor.absPos.x - 1; - door.absPos.y = lastDoor.absPos.y; - } else if (door.side === 'bottom') { - door.absPos.x = lastDoor.absPos.x; - door.absPos.y = lastDoor.absPos.y + 1; - } else if (door.side === 'left') { - door.absPos.x = lastDoor.absPos.x + 1; - door.absPos.y = lastDoor.absPos.y; - } - newRoom.absPos.x = door.absPos.x - door.relPos.x; - newRoom.absPos.y = door.absPos.y - door.relPos.y; - return newRoom.absPos; -} -var calculateAbsPos = (container, object) => { - object.forEach(element => { - element.absPos = new V2D(undefined, undefined); - element.absPos.x = container.absPos.x - element.relPos.x; - element.absPos.y = container.absPos.y - element.relPos.y; - }); -} -var makeNewRoom = (walls, doors) => { - var newWalls = new Array(); - walls.forEach(wall => { - newWalls.push(new Wall(new V2D(wall.relPos.x, wall.relPos.y), wall.side)) - }); - var newDoors = new Array(); - doors.forEach(door => { - newDoors.push(new Door(new V2D(door.relPos.x, door.relPos.y), door.side, true)) - }); - return new Room(newWalls, newDoors); -} -var checkUsedSpace = (newRoom, usedSpace) => { - var roomOK = true; - newRoom.walls.forEach(wall => { - if (wall.side === "top") { - if (usedSpace.get(wall.absPos.x + ", " + wall.absPos.y).top !== undefined) { - roomOK = false; - } - } else if (wall.side === "right") { - if (usedSpace.get(wall.absPos.x + ", " + wall.absPos.y).right !== undefined) { - roomOK = false; - } - } else if (wall.side === "bottom") { - if (usedSpace.get(wall.absPos.x + ", " + wall.absPos.y).bottom !== undefined) { - roomOK = false; - } - } else if (wall.side === "left") { - if (usedSpace.get(wall.absPos.x + ", " + wall.absPos.y).left !== undefined) { - roomOK = false; - } - } - }); - newRoom.doors.forEach(door => { - if (door.side === "top") { - if (usedSpace.get(door.absPos.x + ", " + door.absPos.y).top !== undefined) { - roomOK = false; - } - } else if (door.side === "right") { - if (usedSpace.get(door.absPos.x + ", " + door.absPos.y).right !== undefined) { - roomOK = false; - } - } else if (door.side === "bottom") { - if (usedSpace.get(door.absPos.x + ", " + door.absPos.y).bottom !== undefined) { - roomOK = false; - } - } else if (door.side === "left") { - if (usedSpace.get(door.absPos.x + ", " + door.absPos.y).left !== undefined) { - roomOK = false; - } - } - }); - return roomOK; -} -var checkNeighborCells = (newRoom, usedSpace) => { - var roomOK = true; - newRoom.walls.forEach(wall => { - if (wall.side === "top") { - if (usedSpace.get(wall.absPos.x + ", " + (wall.absPos.y + 1)).bottom instanceof Door) { - roomOK = false; - } - } else if (wall.side === "right") { - if (usedSpace.get((wall.absPos.x + 1) + ", " + wall.absPos.y).left instanceof Door) { - roomOK = false; - } - } else if (wall.side === "bottom") { - if (usedSpace.get(wall.absPos.x + ", " + (wall.absPos.y - 1)).top instanceof Door) { - roomOK = false; - } - } else if (wall.side === "left") { - if (usedSpace.get((wall.absPos.x - 1) + ", " + wall.absPos.y).right instanceof Door) { - roomOK = false; - } - } - }); - newRoom.doors.forEach(door => { - if (door.side === "top") { - if (usedSpace.get(door.absPos.x + ", " + (door.absPos.y + 1)).bottom instanceof Wall) { - roomOK = false; - } - } else if (door.side === "right") { - if (usedSpace.get((door.absPos.x + 1) + ", " + door.absPos.y).left instanceof Wall) { - roomOK = false; - } - } else if (door.side === "bottom") { - if (usedSpace.get(door.absPos.x + ", " + (door.absPos.y - 1)).top instanceof Wall) { - roomOK = false; - } - } else if (door.side === "left") { - if (usedSpace.get((door.absPos.x - 1) + ", " + door.absPos.y).right instanceof Wall) { - roomOK = false; - } - } - }); - return roomOK; -} -var closeNewDoor = (room, newDoor) => { - var newRoom = new Room(room.walls, room.doors, room.absPos); - newRoom.doors.forEach(door => { - if (door.absPos.x === newDoor.absPos.x && door.absPos.y === newDoor.absPos.y && door.side === newDoor.side) { - door.state = false; - } - }); - return newRoom; -} -var closeNeighborDoors = (usedSpace, newRoom) => { - var newUsedSpace = new Map(usedSpace); - newRoom.doors.forEach(door => { - if (door.side === "top" && newUsedSpace.get(door.absPos.x + ", " + (door.absPos.y + 1)).bottom instanceof Door) { - door.state = false; - newUsedSpace.get(door.absPos.x + ", " + (door.absPos.y + 1)).bottom.state = false; - } else if (door.side === "right" && newUsedSpace.get((door.absPos.x + 1) + ", " + door.absPos.y).left instanceof Door) { - door.state = false; - newUsedSpace.get((door.absPos.x + 1) + ", " + door.absPos.y).left.state = false; - } else if (door.side === "bottom" && newUsedSpace.get(door.absPos.x + ", " + (door.absPos.y - 1)).top instanceof Door) { - door.state = false; - newUsedSpace.get(door.absPos.x + ", " + (door.absPos.y - 1)).top.state = false; - } else if (door.side === "left" && newUsedSpace.get((door.absPos.x - 1) + ", " + door.absPos.y).right instanceof Door) { - door.state = false; - newUsedSpace.get((door.absPos.x - 1) + ", " + door.absPos.y).right.state = false; - } - }); - return newUsedSpace; -} - -//START - -var run = (worldData, Display) => { - var display = new Display(document.body, generateWorld(worldData)); - display.draw(); -} \ No newline at end of file +const room00 = []; +const room01 = ['top']; +const room02 = ['right']; +const room03 = ['bottom']; +const room04 = ['left']; +const room05 = ['top', 'right']; +const room06 = ['right', 'bottom']; +const room07 = ['bottom', 'left']; +const room08 = ['left', 'top']; +const room09 = ['top', 'bottom']; +const room0a = ['right', 'left']; +const room0b = ['top', 'right', 'bottom']; +const room0c = ['right', 'bottom', 'left']; +const room0d = ['bottom', 'left', 'top ']; +const room0e = ['left', 'top', 'right']; +const room0f = ['top', 'right', 'bottom', 'left']; +const rooms00_0f = [room00, room01, room02, room03, room04, room05, room06, room07, room08, room09, room0a, room0b, room0c, room0d, room0e, room0f]; +window.onload = () => new Canvas(document.body, new World(16, rooms00_0f)).draw(); diff --git a/js/world.js b/js/world.js new file mode 100644 index 0000000..54558fc --- /dev/null +++ b/js/world.js @@ -0,0 +1,59 @@ +class World { + constructor(size, possibleRooms) { + this.rooms = new Map(); + this.generate = (pos) => { + var posNum = pos.split(',', 2); + var nextPositions = new Map() + .set('top', this.rooms.get((+posNum[0] + 0) + ',' + (+posNum[1] + 1))) + .set('right', this.rooms.get((+posNum[0] + 1) + ',' + (+posNum[1] + 0))) + .set('bottom', this.rooms.get((+posNum[0] + 0) + ',' + (+posNum[1] + -1))) + .set('left', this.rooms.get((+posNum[0] + -1) + ',' + (+posNum[1] + 0))); + var dreamRoom = new Map(); + if (nextPositions.get('top')) + (nextPositions.get('top').indexOf('bottom') > -1) ? dreamRoom.set('top', 'top-door') : dreamRoom.set('top', 'top-wall'); + if (nextPositions.get('right')) + (nextPositions.get('right').indexOf('left') > -1) ? dreamRoom.set('right', 'right-door') : dreamRoom.set('right', 'right-wall'); + if (nextPositions.get('bottom')) + (nextPositions.get('bottom').indexOf('top') > -1) ? dreamRoom.set('bottom', 'bottom-door') : dreamRoom.set('bottom', 'bottom-wall'); + if (nextPositions.get('left')) + (nextPositions.get('left').indexOf('right') > -1) ? dreamRoom.set('left', 'left-door') : dreamRoom.set('left', 'left-wall'); + if (+posNum[1] === this.size / 2 - 1) + dreamRoom.set('top', 'top-wall'); + if (+posNum[0] === this.size / 2 - 1) + dreamRoom.set('right', 'right-wall'); + if (+posNum[1] === -this.size / 2) + dreamRoom.set('bottom', 'bottom-wall'); + if (+posNum[0] === -this.size / 2) + dreamRoom.set('left', 'left-wall'); + var possibleRooms = []; + this.possibleRooms.forEach(possibleRoom => { + if ((!dreamRoom.get('top') || dreamRoom.get('top') === 'top-door' && (possibleRoom.indexOf('top') > -1) || + dreamRoom.get('top') === 'top-wall' && !(possibleRoom.indexOf('top') > -1)) && + (!dreamRoom.get('right') || dreamRoom.get('right') === 'right-door' && (possibleRoom.indexOf('right') > -1) || + dreamRoom.get('right') === 'right-wall' && !(possibleRoom.indexOf('right') > -1)) && + (!dreamRoom.get('bottom') || dreamRoom.get('bottom') === 'bottom-door' && (possibleRoom.indexOf('bottom') > -1) || + dreamRoom.get('bottom') === 'bottom-wall' && !(possibleRoom.indexOf('bottom') > -1)) && + (!dreamRoom.get('left') || dreamRoom.get('left') === 'left-door' && (possibleRoom.indexOf('left') > -1) || + dreamRoom.get('left') === 'left-wall' && !(possibleRoom.indexOf('left') > -1))) + possibleRooms.push(possibleRoom); + }); + var room = possibleRooms[Math.floor(Math.random() * possibleRooms.length)]; + if (room) { + this.rooms.set(pos, room); + room.forEach(door => { + if (door === 'top' && !nextPositions.get('top')) + this.generate((+posNum[0] + 0) + ',' + (+posNum[1] + 1)); + else if (door === 'right' && !nextPositions.get('right')) + this.generate((+posNum[0] + 1) + ',' + (+posNum[1] + 0)); + else if (door === 'bottom' && !nextPositions.get('bottom')) + this.generate((+posNum[0] + 0) + ',' + (+posNum[1] + -1)); + else if (door === 'left' && !nextPositions.get('left')) + this.generate((+posNum[0] + -1) + ',' + (+posNum[1] + 0)); + }); + } + }; + this.size = size; + this.possibleRooms = possibleRooms; + this.generate('0,0'); + } +} diff --git a/ts/canvas.ts b/ts/canvas.ts new file mode 100644 index 0000000..2f04959 --- /dev/null +++ b/ts/canvas.ts @@ -0,0 +1,39 @@ +class Canvas { + public canvas: HTMLCanvasElement = document.createElement('canvas'); + public cx: CanvasRenderingContext2D = this.canvas.getContext("2d", { alpha: false }); + public zoom: number = 4; + public world: World; + + constructor(parent: HTMLElement, world: World) { + this.canvas.width = world.size * 8 * this.zoom; + this.canvas.height = world.size * 8 * this.zoom; + parent.appendChild(this.canvas); + this.cx.scale(this.zoom, -this.zoom); + this.cx.translate(0, -world.size * 8); + this.cx.imageSmoothingEnabled = false; + this.world = world; + } + + public draw = () => { + this.cx.fillStyle = '#033'; + this.cx.strokeStyle = "#0f0"; + this.cx.fillRect(0, 0, this.canvas.width, this.canvas.height); + for (let x = 0; x < this.world.size; x++) for (let y = 0; y < this.world.size; y++) this.cx.strokeRect(x * 8 + 0.5, y * 8 + 0.5, 7, 7); + + this.cx.fillStyle = "#888"; + this.cx.strokeStyle = "#fff"; + this.world.rooms.forEach((room, pos) => { + var posNum: Array = pos.split(',', 2); + var posX: number = (+posNum[0]) * 8 + this.world.size / 2 * 8; + var posY: number = (+posNum[1]) * 8 + this.world.size / 2 * 8; + this.cx.fillRect(posX, posY, 8, 8); + this.cx.strokeRect(posX + 0.5, posY + 0.5, 7, 7); + room.forEach(door => { + if (door === "top") this.cx.fillRect(posX + 3, posY + 7, 2, 1); + if (door === "right") this.cx.fillRect(posX + 7, posY + 3, 1, 2); + if (door === "bottom") this.cx.fillRect(posX + 3, posY, 2, 1); + if (door === "left") this.cx.fillRect(posX, posY + 3, 1, 2); + }); + }); + } +} \ No newline at end of file diff --git a/ts/main.ts b/ts/main.ts new file mode 100644 index 0000000..191d05f --- /dev/null +++ b/ts/main.ts @@ -0,0 +1,20 @@ +const room00: Array = []; +const room01: Array = ['top']; +const room02: Array = ['right']; +const room03: Array = ['bottom']; +const room04: Array = ['left']; +const room05: Array = ['top', 'right']; +const room06: Array = ['right', 'bottom']; +const room07: Array = ['bottom', 'left']; +const room08: Array = ['left', 'top']; +const room09: Array = ['top', 'bottom']; +const room0a: Array = ['right', 'left']; +const room0b: Array = ['top', 'right', 'bottom']; +const room0c: Array = ['right', 'bottom', 'left']; +const room0d: Array = ['bottom', 'left', 'top ']; +const room0e: Array = ['left', 'top', 'right']; +const room0f: Array = ['top', 'right', 'bottom', 'left']; + +const rooms00_0f: Array> = [room00, room01, room02, room03, room04, room05, room06, room07, room08, room09, room0a, room0b, room0c, room0d, room0e, room0f]; + +window.onload = () => new Canvas(document.body, new World(16, rooms00_0f)).draw(); \ No newline at end of file diff --git a/ts/world.ts b/ts/world.ts new file mode 100644 index 0000000..a87cd10 --- /dev/null +++ b/ts/world.ts @@ -0,0 +1,56 @@ +class World { + public rooms: Map> = new Map(); + public size: number; + public possibleRooms: Array>; + + constructor(size: number, possibleRooms: Array>) { + this.size = size; + this.possibleRooms = possibleRooms; + this.generate('0,0'); + } + + public generate = (pos: string): void => { + var posNum: Array = pos.split(',', 2); + var nextPositions: Map> = new Map() + .set('top', this.rooms.get((+posNum[0] + 0) + ',' + (+posNum[1] + 1))) + .set('right', this.rooms.get((+posNum[0] + 1) + ',' + (+posNum[1] + 0))) + .set('bottom', this.rooms.get((+posNum[0] + 0) + ',' + (+posNum[1] + -1))) + .set('left', this.rooms.get((+posNum[0] + -1) + ',' + (+posNum[1] + 0))); + + var dreamRoom: Map = new Map(); + if (nextPositions.get('top')) (nextPositions.get('top').indexOf('bottom') > -1) ? dreamRoom.set('top', 'top-door') : dreamRoom.set('top', 'top-wall'); + if (nextPositions.get('right')) (nextPositions.get('right').indexOf('left') > -1) ? dreamRoom.set('right', 'right-door') : dreamRoom.set('right', 'right-wall'); + if (nextPositions.get('bottom')) (nextPositions.get('bottom').indexOf('top') > -1) ? dreamRoom.set('bottom', 'bottom-door') : dreamRoom.set('bottom', 'bottom-wall'); + if (nextPositions.get('left')) (nextPositions.get('left').indexOf('right') > -1) ? dreamRoom.set('left', 'left-door') : dreamRoom.set('left', 'left-wall'); + + if (+posNum[1] === this.size / 2 - 1) dreamRoom.set('top', 'top-wall'); + if (+posNum[0] === this.size / 2 - 1) dreamRoom.set('right', 'right-wall'); + if (+posNum[1] === -this.size / 2) dreamRoom.set('bottom', 'bottom-wall'); + if (+posNum[0] === -this.size / 2) dreamRoom.set('left', 'left-wall'); + + var possibleRooms: Array> = []; + this.possibleRooms.forEach(possibleRoom => { + if ( + (!dreamRoom.get('top') || dreamRoom.get('top') === 'top-door' && (possibleRoom.indexOf('top') > -1) || + dreamRoom.get('top') === 'top-wall' && !(possibleRoom.indexOf('top') > -1)) && + (!dreamRoom.get('right') || dreamRoom.get('right') === 'right-door' && (possibleRoom.indexOf('right') > -1) || + dreamRoom.get('right') === 'right-wall' && !(possibleRoom.indexOf('right') > -1)) && + (!dreamRoom.get('bottom') || dreamRoom.get('bottom') === 'bottom-door' && (possibleRoom.indexOf('bottom') > -1) || + dreamRoom.get('bottom') === 'bottom-wall' && !(possibleRoom.indexOf('bottom') > -1)) && + (!dreamRoom.get('left') || dreamRoom.get('left') === 'left-door' && (possibleRoom.indexOf('left') > -1) || + dreamRoom.get('left') === 'left-wall' && !(possibleRoom.indexOf('left') > -1)) + ) possibleRooms.push(possibleRoom); + }); + + var room: Array = possibleRooms[Math.floor(Math.random() * possibleRooms.length)]; + if (room) { + this.rooms.set(pos, room); + room.forEach(door => { + if (door === 'top' && !nextPositions.get('top')) this.generate((+posNum[0] + 0) + ',' + (+posNum[1] + 1)); + else if (door === 'right' && !nextPositions.get('right')) this.generate((+posNum[0] + 1) + ',' + (+posNum[1] + 0)); + else if (door === 'bottom' && !nextPositions.get('bottom')) this.generate((+posNum[0] + 0) + ',' + (+posNum[1] + -1)); + else if (door === 'left' && !nextPositions.get('left')) this.generate((+posNum[0] + -1) + ',' + (+posNum[1] + 0)); + }); + } + } +} \ No newline at end of file diff --git a/tsconfig.json b/tsconfig.json new file mode 100644 index 0000000..2a58016 --- /dev/null +++ b/tsconfig.json @@ -0,0 +1,9 @@ +{ + "compilerOptions": { + "module": "commonjs", + "target": "es6", + "noImplicitAny": true, + "sourceMap": false, + "outDir": "js" + } +} \ No newline at end of file