From 6f2262de521086da04f8c3ec3f4b810593fd8dde Mon Sep 17 00:00:00 2001 From: Danielv123 Date: Tue, 6 Feb 2018 13:11:35 +0100 Subject: [PATCH] Using spritesheets for more entities --- static/lib/entityDrawRules.js | 94 +++++++++++++++++++++++++++++++---- static/remoteMap.js | 36 ++++++++------ 2 files changed, 107 insertions(+), 23 deletions(-) diff --git a/static/lib/entityDrawRules.js b/static/lib/entityDrawRules.js index 673c8b46..007c63f1 100644 --- a/static/lib/entityDrawRules.js +++ b/static/lib/entityDrawRules.js @@ -13,15 +13,38 @@ export var entityDrawRules = { } }, "accumulator": { + spritesheet: spritesheetJson.frames["images/factorio/entity/accumulator/accumulator.png"], sizeInTiles: { - x:2, - y:2, + x:4, + y:4, }, positionOffset: { x:-1, - y:-1, + y:-2, } }, + "radar": { + spritesheet: spritesheetJson.frames["images/factorio/entity/radar/radar.png.22"], + sizeInTiles: { + x:4, + y:4, + }, + positionOffset: { + x:-0.8, + y:-1.5, + }, + }, + "centrifuge": { + spritesheet: spritesheetJson.frames["images/factorio/entity/centrifuge/centrifuge-A.png.0"], + sizeInTiles: { + x:4, + y:4, + }, + positionOffset: { + x:-1.5, + y:-1, + }, + }, }; let template3x3entity = { sizeInTiles: { @@ -35,12 +58,40 @@ let template3x3entity = { }; for(let i = 1; i <= 3; i++){ let name = "assembling-machine-"+i; - entityDrawRules[name] = template3x3entity; -}; -["chemical-plant", "radar", "solar-panel", "lab", "electric-mining-drill", "beacon", "electric-furnace"].forEach(name => { + // entityDrawRules[name] = entityDrawRules[name] = { spritesheet: spritesheetJson.frames["images/factorio/entity/"+name+"/"+name+".png.0"], - sizeInTiles: { + sizeInTiles: { + x:3.9, + y:3.9, + }, + positionOffset: { + x:-1.4, + y:-0.9, + }, + } + // template3x3entity; +}; +["electric-mining-drill", "beacon", "electric-furnace"].forEach(name => { + entityDrawRules[name] = template3x3entity; +}); +["chemical-plant", "lab"].forEach(name => { + entityDrawRules[name] = { + spritesheet: spritesheetJson.frames["images/factorio/entity/"+name+"/"+name+".png.0"], + sizeInTiles: { + x:3.5, + y:3, + }, + positionOffset: { + x:-1, + y:-0.9, + }, + } +}); +[{name: "solar-panel", ref:"images/factorio/entity/solar-panel/solar-panel.png"}].forEach(ent => { + entityDrawRules[ent.name] = { + spritesheet: spritesheetJson.frames[ent.ref], + sizeInTiles: { x:3, y:3, }, @@ -49,7 +100,22 @@ for(let i = 1; i <= 3; i++){ y:-1, }, } - // entityDrawRules[name] = template3x3entity; +}); +// 2 tile entities +[{name: "stone-furnace", ref:"images/factorio/entity/stone-furnace/stone-furnace.png"}, + {name: "steel-furnace", ref:"images/factorio/entity/steel-furnace/steel-furnace.png"} + ].forEach(ent => { + entityDrawRules[ent.name] = { + spritesheet: spritesheetJson.frames[ent.ref], + sizeInTiles: { + x:2.5, + y:2.5, + }, + positionOffset: { + x:-1, + y:-1, + }, + } }); ["transport-belt", "fast-transport-belt", "express-transport-belt"].forEach(name => { entityDrawRules[name] = { @@ -63,4 +129,14 @@ for(let i = 1; i <= 3; i++){ } } }); - +entityDrawRules["oil-refinery"] = { + spritesheet: spritesheetJson.frames["images/factorio/entity/oil-refinery/oil-refinery.png.0"], + sizeInTiles: { + x:9, + y:6, + }, + positionOffset: { + x:-2, + y:-2, + }, +} diff --git a/static/remoteMap.js b/static/remoteMap.js index d1fa8b15..2f4105d4 100644 --- a/static/remoteMap.js +++ b/static/remoteMap.js @@ -187,20 +187,11 @@ function drawEntity(entity, dontCache){ queue: [], loaded: false, }; - entityImages[name].queue.push(entity); - entityImages[name].img.onload = function(){ - // process queue and display - console.log("Image loaded!"); - entityImages[name].loaded = true; - entityImages[name].queue.forEach(entity => { - entityImages[name].draw(entity); - }); - entityImages[name].queue = []; - } entityImages[name].draw = function(entity){ if(this.loaded){ let name = entity.entity.name; let image, sprWidth, sprHeight, offLeft, offTop + let rotation = 0; // check hardcoded entity draw rules for specifics (otherwise draw icon as 1x1 entity with rotation if specified) if(entityDrawRules[name]){ let rules = entityDrawRules[name] @@ -216,7 +207,7 @@ function drawEntity(entity, dontCache){ sprHeight = rules.spritesheet.frame.h; offLeft = rules.spritesheet.frame.x; offTop = rules.spritesheet.frame.y; - image = global.spritesheet + image = global.spritesheet; } } else { var offsetX = 0, offsetY = 0; @@ -226,9 +217,12 @@ function drawEntity(entity, dontCache){ } let xPos = ((entity.x + offsetX) * 16) - playerPosition.x; let yPos = ((entity.y + offsetY) * 16) - playerPosition.y; - let rotation = 0; if(entity.entity.rot && !isNaN(Number(entity.entity.rot))){ - if(entityDrawRules[name] && entityDrawRules[name].rotOffset){ + let rules = entityDrawRules[name]; + if(rules && rules.directions){ + // draw different sprites for different rotations + + } else if(rules && rules.rotOffset){ rotation = ((entity.entity.rot * 45) + entityDrawRules[name].rotOffset); } else { rotation = entity.entity.rot * 45; @@ -242,7 +236,21 @@ function drawEntity(entity, dontCache){ this.queue.push(entity); } } - entityImages[name].img.src = getImageFromName(name); + let imageLoaded = function(){ + // process queue and display + console.log("Image loaded!"); + entityImages[name].loaded = true; + entityImages[name].queue.forEach(entity => { + entityImages[name].draw(entity); + }); + entityImages[name].queue = []; + } + entityImages[name].queue.push(entity); + entityImages[name].img.onload = imageLoaded() + + if(entityDrawRules[name]){ + imageLoaded(); + } else entityImages[name].img.src = getImageFromName(name); } else { entityImages[name].draw(entity); }