From b31d4148dec78787850d73a1356126bd6a4ced5f Mon Sep 17 00:00:00 2001 From: =?utf8?q?Paul=20H=C3=A4nsch?= Date: Thu, 13 Feb 2020 02:00:35 +0100 Subject: [PATCH] npc loading --- engine.js | 50 ++++++++++++++++++++++++++++++++++++++++++++++---- 1 file changed, 46 insertions(+), 4 deletions(-) diff --git a/engine.js b/engine.js index 0750e87..281debb 100644 --- a/engine.js +++ b/engine.js @@ -1,6 +1,6 @@ var gamedata = { // associative array for gamedata files - load: def => this[def] ? this[def] : this[def] = new Textfile(def) + load: function(def) { return this[def] ? this[def] : this[def] = new Textfile(def); } } var gfx = { // associative array for game graphics @@ -124,6 +124,15 @@ function Map(textdef) { dy[y * w + x] = (x + y) * th / 2; } + const npcs = []; + for (let def of this.info.npc) { + let npc = new Npc(def.filename) + let loc = def.location.split(',')[1] * 1 * w + def.location.split(',')[0] * 1; + npc.place(dx[loc], dy[loc]); + npcs[loc] = npc; + this.info.layer.find(l => l.type == "collision").data[loc] = 1; + } + // tile index for pixel position on map this.tileAt = function(x, y) { var r = (y + th / 2) / th; var c = (x - w * tw /2) / tw; @@ -131,6 +140,11 @@ function Map(textdef) { return ny * w + nx; } + // vice versa the pixel coordinates of a given map tile + this.positionOf = tile => [dx[tile], dy[tile]]; + this.xOf = tile => dx[tile]; + this.yOf = tile => dy[tile]; + // center map to pixel position (by setting drawing offsets) this.center = function(x, y) { posx = canvas.canvas.width / 2 - x; @@ -161,6 +175,7 @@ function Map(textdef) { for ( i = 0; i < h * w; i++ ) { draw_tile(ob[i], posx + dx[i], posy + dy[i]); if (mm[i]) mm[i].forEach(m => m.draw(posx + m.position[0], posy + m.position[1])); + if (npcs[i]) npcs[i].draw(posx + dx[i], posy + dy[i]); } } @@ -193,6 +208,18 @@ function Mob(textdef) { var frametime = performance.now(); gfx.load(info.image) + // some simplified npc files do not define animation frames + // render size and offset are given instead, and we + // assume, that we can just loop horizontally over the image + if (!info[animation].frame){ + info[animation].frame = []; + let rs = info.render_size.split(/,/); rs = [ rs[0] * 1, rs[1] * 1 ]; + let ro = info.render_offset.split(/,/); ro = [ ro[0] * 1, ro[1] * 1 ]; + + for (let i = 0; i < info[animation].frames; i++ ) + info[animation].frame[i] = [[ i * rs[0], 0, rs[0], rs[1], ro[0], ro[1]]]; + } + // place mob on x/y pixel coordinates // e.g. when spawning, walking, etc. this.place = function(x, y) { @@ -260,6 +287,21 @@ function Mob(textdef) { this.swing = () => this.animate("swing" ); } +function Npc(textdef){ + this.info = gamedata.load(textdef); + const avatar = new Mob(this.info.gfx); + + this.place = function(x, y) { + avatar.place(x,y); + return this; + } + + this.draw = function(x, y) { + avatar.draw(x, y); + return this; + } +} + function Hero(gender = "female", hair = "short"){ // Object for player character // unique in single player @@ -403,9 +445,9 @@ window.addEventListener("resize", function(){ // player = new Mob("animations/enemies/zombie.txt"); player.stats = { speed: 3 }; player = new Hero(); map = new Map("/maps/arrival.txt"); -player.place(map.info.header.hero_pos.split(/,/)[0] * map.info.header.tilewidth, - map.info.header.hero_pos.split(/,/)[1] * map.info.header.tileheight); -player.direct(5).stance(); +player.place(map.xOf(map.info.header.hero_pos.split(',')[1] * 1 * map.info.header.width + map.info.header.hero_pos.split(',')[0] * 1), + map.yOf(map.info.header.hero_pos.split(',')[1] * 1 * map.info.header.width + map.info.header.hero_pos.split(',')[0] * 1)); +player.direct(6).stance(); map.center(player.position[0], player.position[1]); c = new Controls(player, map); -- 2.39.2