diff --git a/res/images/allSprites_retina.png b/res/images/allSprites_retina.png deleted file mode 100644 index bc408cb..0000000 Binary files a/res/images/allSprites_retina.png and /dev/null differ diff --git a/res/images/allSprites_retina.xml b/res/images/allSprites_retina.xml deleted file mode 100644 index 2d5edbd..0000000 --- a/res/images/allSprites_retina.xml +++ /dev/null @@ -1,189 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/res/images/onlyObjects_retina.png b/res/images/onlyObjects_retina.png deleted file mode 100644 index 82e9bfc..0000000 Binary files a/res/images/onlyObjects_retina.png and /dev/null differ diff --git a/res/images/onlyObjects_retina.xml b/res/images/onlyObjects_retina.xml deleted file mode 100644 index f8a1635..0000000 --- a/res/images/onlyObjects_retina.xml +++ /dev/null @@ -1,149 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/res/images/terrainTiles_default.json b/res/images/terrainTiles_default.json new file mode 100644 index 0000000..2f68833 --- /dev/null +++ b/res/images/terrainTiles_default.json @@ -0,0 +1,42 @@ +[ + { "x": 0, "y": 0 }, + { "x": 1, "y": 0 }, + { "x": 2, "y": 0 }, + { "x": 3, "y": 0 }, + { "x": 4, "y": 0 }, + { "x": 5, "y": 0 }, + { "x": 6, "y": 0 }, + { "x": 7, "y": 0 }, + { "x": 8, "y": 0 }, + { "x": 9, "y": 0 }, + { "x": 0, "y": 1 }, + { "x": 1, "y": 1 }, + { "x": 2, "y": 1 }, + { "x": 3, "y": 1 }, + { "x": 4, "y": 1 }, + { "x": 5, "y": 1 }, + { "x": 6, "y": 1 }, + { "x": 7, "y": 1 }, + { "x": 8, "y": 1 }, + { "x": 9, "y": 1 }, + { "x": 0, "y": 2 }, + { "x": 1, "y": 2 }, + { "x": 2, "y": 2 }, + { "x": 3, "y": 2 }, + { "x": 4, "y": 2 }, + { "x": 5, "y": 2 }, + { "x": 6, "y": 2 }, + { "x": 7, "y": 2 }, + { "x": 8, "y": 2 }, + { "x": 9, "y": 2 }, + { "x": 0, "y": 3 }, + { "x": 1, "y": 3 }, + { "x": 2, "y": 3 }, + { "x": 3, "y": 3 }, + { "x": 4, "y": 3 }, + { "x": 5, "y": 3 }, + { "x": 6, "y": 3 }, + { "x": 7, "y": 3 }, + { "x": 8, "y": 3 }, + { "x": 9, "y": 3 } +] \ No newline at end of file diff --git a/res/images/terrainTiles_default.png b/res/images/terrainTiles_default.png new file mode 100644 index 0000000..f0449d0 Binary files /dev/null and b/res/images/terrainTiles_default.png differ diff --git a/src/entities/Object.js b/src/entities/Object.js index 0a806a6..71abc79 100644 --- a/src/entities/Object.js +++ b/src/entities/Object.js @@ -1,9 +1,9 @@ var asdf = require("asdf-games"); // eslint-disable-next-line no-unused-vars -const { Container, TileSpriteXML, math, Texture, SpriteSheetXML } = asdf; +const { Container, TileSpriteXML, math, Texture, SpriteSheetXML, entity } = asdf; -const texture = new Texture("../res/images/allSprites_default.png"); -const xml = new SpriteSheetXML("../res/images/allSprites_default.xml"); +const texture = new Texture("../res/images/onlyObjects_default.png"); +const xml = new SpriteSheetXML("../res/images/onlyObjects_default.xml"); // properties = { // type: "", @@ -15,35 +15,64 @@ class Object extends TileSpriteXML { constructor(level, pos, properties) { var type; switch (properties.type) { - case "crate_metal": + case "crateMetal": type = "crateMetal.png"; properties.pushable = (properties.pushable == undefined) ? true : properties.pushable; properties.explode = (properties.explode == undefined) ? false : properties.explode; break; - case "crate_wood": + case "crateWood": type = "crateWood.png"; properties.pushable = (properties.pushable == undefined) ? true : properties.pushable; properties.explode = (properties.explode == undefined) ? false : properties.explode; break; - case "fence_red": + case "fenceRed": type = "fenceRed.png"; properties.pushable = (properties.pushable == undefined) ? true : properties.pushable; properties.explode = (properties.explode == undefined) ? false : properties.explode; break; - case "fence_yellow": + case "fenceYellow": type = "fenceYellow.png"; properties.pushable = (properties.pushable == undefined) ? true : properties.pushable; properties.explode = (properties.explode == undefined) ? false : properties.explode; break; + case "wireCrooked": + type = "wireCrooked.png"; + properties.pushable = (properties.pushable == undefined) ? false : properties.pushable; + properties.explode = (properties.explode == undefined) ? false : properties.explode; + break; + case "wireStraight": + type = "wireStraight.png"; + properties.pushable = (properties.pushable == undefined) ? false : properties.pushable; + properties.explode = (properties.explode == undefined) ? false : properties.explode; + break; + case "barricadeMetal": + type = "barricadeMetal.png"; + properties.pushable = (properties.pushable == undefined) ? false : properties.pushable; + properties.explode = (properties.explode == undefined) ? false : properties.explode; + break; + case "barricadeWood": + type = "barricadeWood.png"; + properties.pushable = (properties.pushable == undefined) ? true : properties.pushable; + properties.explode = (properties.explode == undefined) ? false : properties.explode; + break; } + super(texture, xml, xml.findIndex("name", type)); this.level = level; this.pos = pos; this.rotation = properties.rotation || 0; + + this.properties = properties; + console.log(this.properties); + + entity.addDebug(this); + + console.log(this.level.players); } update(dt, t) { super.update(dt, t); + } } diff --git a/src/entities/Tank.js b/src/entities/Tank.js index 8de2465..8885d59 100644 --- a/src/entities/Tank.js +++ b/src/entities/Tank.js @@ -2,8 +2,8 @@ var asdf = require("asdf-games"); // eslint-disable-next-line no-unused-vars const { Container, TileSpriteXML, math, Texture, SpriteSheetXML } = asdf; -const texture = new Texture("../res/images/allSprites_default.png"); -const xml = new SpriteSheetXML("../res/images/allSprites_default.xml"); +const texture = new Texture("../res/images/onlyObjects_default.png"); +const xml = new SpriteSheetXML("../res/images/onlyObjects_default.xml"); class Bullet extends TileSpriteXML { constructor(player, type) { @@ -130,7 +130,7 @@ class Tank extends TileSpriteXML { } // Shoot bullet on action key - if (this.keys.action && this.firerate.current >= this.firerate.min && this.bullets.children.length <= this.firerate.maxAmount) { + if (this.mouse.isDown && this.firerate.current >= this.firerate.min && this.bullets.children.length <= this.firerate.maxAmount) { var bullet = new Bullet(this, 0); bullet.rotation = this.barrel.rotation; bullet.pos = { diff --git a/src/helpers/Level.js b/src/helpers/Level.js index 7aa7279..30d9be8 100644 --- a/src/helpers/Level.js +++ b/src/helpers/Level.js @@ -1,15 +1,22 @@ +const fs = require("fs"); + const asdf = require("asdf-games"); // eslint-disable-next-line no-unused-vars -const { Container, Texture, SpriteSheetXML, TileMapXML } = asdf; +const { Container, Texture, TileMap } = asdf; -const texture = new Texture("../res/images/allSprites_default.png"); -const xml = new SpriteSheetXML("../res/images/allSprites_default.xml"); +const texture = new Texture("../res/images/terrainTiles_default.png"); +const tilemap = JSON.parse(fs.readFileSync("./res/images/terrainTiles_default.json")); const Object = require("../entities/Object.js"); -class Level extends TileMapXML { +class Level extends TileMap { constructor(level, game, players) { - super(level.tileData, Math.ceil(game.w / 64), Math.ceil(game.h / 64), texture, xml); + var tileData = []; + level.tileData.forEach(value => { + tileData.push(tilemap[value]); + }); + + super(tileData, Math.ceil(game.w / 64), Math.ceil(game.h / 64), 64, 64, texture); this.game = game; this.players = players; diff --git a/src/levels/default.json b/src/levels/default.json index 5a70735..ffb27da 100644 --- a/src/levels/default.json +++ b/src/levels/default.json @@ -1,25 +1,25 @@ { "tileData": [ - 161, 160, 160, 161, 160, 159, 134, 135, 143, 134, 135, 135, - 161, 160, 160, 161, 161, 159, 135, 134, 143, 135, 135, 134, - 161, 161, 160, 161, 160, 159, 134, 135, 144, 142, 142, 142, - 161, 160, 160, 161, 160, 159, 135, 134, 143, 135, 134, 135, - 161, 160, 161, 161, 160, 159, 134, 135, 143, 134, 135, 135, - 160, 160, 160, 161, 160, 159, 135, 134, 143, 135, 135, 134, - 161, 160, 160, 168, 168, 155, 142, 142, 138, 135, 135, 135, - 160, 160, 160, 161, 160, 159, 135, 134, 134, 135, 134, 135 + 20, 30, 21, 20, 30,8, 0, 10, 1, 0, 10, 10, + 20, 30, 21, 20, 20,8, 10, 0, 1, 10, 10, 0, + 20, 20, 21, 20, 30,8, 0, 10, 3, 2, 2, 2, + 20, 30, 21, 20, 30,8, 10, 0, 1, 10, 0, 10, + 20, 30, 21, 20, 30,8, 0, 10, 1, 0, 10, 10, + 30, 30, 21, 20, 30,8, 10, 0, 1, 10, 10, 0, + 22, 22, 31, 22, 22, 9, 2, 2, 16, 10, 10, 10, + 30, 30, 21, 20, 30,8, 10, 0, 0, 10, 0, 10 ], "objects": [ { "pos": { "x": 100, "y": 100 }, "properties": { - "type": "crate_metal" + "type": "barricadeWood" } }, { "pos": { "x": 100, "y": 100 }, "properties": { - "type": "fence_yellow", + "type": "wireStraight", "rotation": 3 } } diff --git a/src/screens/game.js b/src/screens/game.js index 0115b40..a359307 100644 --- a/src/screens/game.js +++ b/src/screens/game.js @@ -18,39 +18,41 @@ class GameScreen extends Container { this.controls.keys.reset(); - // Connect to TanksJS-Server instance - this.socket = io("http://localhost:3000"); - this.socket.on("identify", () => { - this.socket.emit("identification", { - name: "Arn", - gamemode: 2 - }); - console.log(`Connected to server as ${this.socket.id}`); - }); - + // Define tank colours const colours = ["Blue", "Red", "Green", "Sand"]; // Keep local and external players this.players = {}; - // Draw level - var json = fs.readFileSync("./src/levels/default.json"); - var level = new Level(JSON.parse(json), this.game, this.players); - this.add(level); + // Connect to TanksJS-Server instance + this.socket = io("http://arnweb.nl:3000"); + this.socket.on("identify", () => { + this.socket.emit("identification", { + name: "Arn", + gamemode: 2 + }); + console.log(`Connected to server as ${this.socket.id}`); - // Define local player - this.players[this.socket.id] = new Tank(this.controls.keys, this.controls.mouse, level, colours[Object.keys(this.players).length]); - this.player = this.players[this.socket.id]; - this.add(this.players[this.socket.id]); + // Draw level + var json = fs.readFileSync("./src/levels/default.json"); + this.level = new Level(JSON.parse(json), this.game, this.players); + this.add(this.level); + + // Define local player + this.players[this.socket.id] = new Tank(this.controls.keys, this.controls.mouse, this.level, colours[Object.keys(this.players).length]); + this.player = this.players[this.socket.id]; + this.add(this.players[this.socket.id]); + + // Store current state of controls for comparing + this.dataBuffer = JSON.stringify({ + pos: this.player.pos, + rotation: { + body: this.player.rotation, + barrel: this.player.children[0].rotation + } + }); - // Store current state of controls for comparing - this.dataBuffer = JSON.stringify({ - pos: this.player.pos, - rotation: { - body: this.player.rotation, - barrel: this.player.children[0].rotation - } }); // Handle player logins @@ -58,12 +60,18 @@ class GameScreen extends Container { // Add any player that is not the local player and is not already added for (const id in data) { if (id != this.socket.id && !(this.players[id])) { - this.players[id] = new Tank(new KeyControls(false), new MouseControls(false), level, colours[Object.keys(this.players).length], true); + this.players[id] = new Tank(new KeyControls(false), new MouseControls(false), this.level, colours[Object.keys(this.players).length], true); this.add(this.players[id]); } } - console.log(this.players); - // TODO: Remove players who left + + // Remove any player that disconnects from the game + for (const id in this.players) { + if (data[id] == undefined) { + this.remove(this.players[id]); + delete this.players[id]; + } + } }); // Handle player updates @@ -86,18 +94,20 @@ class GameScreen extends Container { update(dt, t) { super.update(dt, t); - // Only send when controls are updated and minify data sent - var data = { - pos: this.player.pos, - rotation: { - body: this.player.rotation, - barrel: this.player.children[0].rotation + if (this.player != undefined) { + // Only send when controls are updated and minify data sent + var data = { + pos: this.player.pos, + rotation: { + body: this.player.rotation, + barrel: this.player.children[0].rotation + } + }; + if (JSON.stringify(data) != this.dataBuffer) { + console.log("Sending updates"); + this.socket.emit("update", data); + this.dataBuffer = JSON.stringify(data); } - }; - if (JSON.stringify(data) != this.dataBuffer) { - console.log("Sending updates"); - this.socket.emit("update", data); - this.dataBuffer = JSON.stringify(data); } } }