From dc62e714d6f28204b47db83edbb465c4592f224a Mon Sep 17 00:00:00 2001 From: Danielv123 Date: Sat, 3 Mar 2018 21:58:16 +0100 Subject: [PATCH] remoteMap animated belts (yellows are bugged) --- sharedPlugins/remoteMap/index.js | 4 +- static/lib/entityDrawRules.js | 38 +++++++++++---- static/lib/utility.js | 11 ++++- static/remoteMap.js | 83 ++++++++++++++++++++++++-------- 4 files changed, 102 insertions(+), 34 deletions(-) diff --git a/sharedPlugins/remoteMap/index.js b/sharedPlugins/remoteMap/index.js index 691218fe..1d42842d 100644 --- a/sharedPlugins/remoteMap/index.js +++ b/sharedPlugins/remoteMap/index.js @@ -55,11 +55,11 @@ class remoteMap { this.socket.on("placeEntity", req => { // game.player.surface.create_entity{name="small-ship-wreck", position={game.player.position.x-2, game.player.position.y+1}, direction=..., force=...} console.log("placing "+JSON.stringify(req)); - if(req.name && typeof req.name == "string" && req.position && Number(req.position.x) && Number(req.position.y)){ + if(req.name && typeof req.name == "string" && req.position && !isNaN(Number(req.position.x)) && !isNaN(Number(req.position.y))){ if(req.name == "deleted"){ // {{'+req.position.x+','+req.position.y+'},{'+req.position.x+','+req.position.y+'}} this.messageInterface('/silent-command local toDelete = game.surfaces[1].find_entities({{'+req.position.x+','+req.position.y+'},{'+(req.position.x+1)+','+(req.position.y+1)+'}}) for i, entity in pairs(toDelete) do entity.die() end'); // this position is now empty, delete whatever was there from DB - // this.deleteEntity(req.position.x, req.position.y); + this.deleteEntity(req.position.x, req.position.y); } else { let command = '/silent-command game.surfaces[1].create_entity{name="'+req.name+'", position={'+Number(req.position.x)+', '+Number(req.position.y)+'}, force="neutral"' if(req.direction) command += ', direction='+req.direction; diff --git a/static/lib/entityDrawRules.js b/static/lib/entityDrawRules.js index f2cf47fd..e14e3cf6 100644 --- a/static/lib/entityDrawRules.js +++ b/static/lib/entityDrawRules.js @@ -231,14 +231,33 @@ entityDrawRules["chemical-plant"] = { ["transport-belt", "fast-transport-belt", "express-transport-belt"].forEach(name => { entityDrawRules[name] = { - rotOffset: 270, - spritesheet: spritesheetJson.frames["images/factorio/entity/"+name+"/"+name+".png.10"], - sizeInTiles: { - x:1.2,y:1.6, - }, - positionOffset: { - x:0,y:-0.2, - } + spritesheet: [{ + spritesheet: [ // vertical belts + // spritesheetJson.frames["images/factorio/entity/"+name+"/"+name+".png.0"], // 0 to 31 + ], + sizeInTiles: { + x:1.2,y:1.4, + }, + positionOffset: { + x:-0.1,y:-0, + } + },{ + spritesheet: [ // horizontal belts + // spritesheetJson.frames["images/factorio/entity/"+name+"/"+name+".png.27"], // 32 to 63 + ], + sizeInTiles: { + x:1.3,y:1.6, + }, + positionOffset: { + x:-0.15,y:-0.25, + } + }], + } + for(let i = 0; i < 32; i++){ + // up + entityDrawRules[name].spritesheet[1].spritesheet.push(spritesheetJson.frames["images/factorio/entity/"+name+"/"+name+".png."+i]); + // right + entityDrawRules[name].spritesheet[0].spritesheet.push(spritesheetJson.frames["images/factorio/entity/"+name+"/"+name+".png."+(i+32)]); } }); ["splitter", "fast-splitter", "express-splitter"].forEach(splitter => { @@ -266,8 +285,7 @@ entityDrawRules["oil-refinery"] = { spritesheet: spritesheetJson.frames["images/factorio/entity/oil-refinery/oil-refinery.png.2"], }, { spritesheet: spritesheetJson.frames["images/factorio/entity/oil-refinery/oil-refinery.png.3"], - } - ], + }], } // correct image size for the oil refinery frames (same for all of them on this one) entityDrawRules["oil-refinery"].spritesheet.forEach(object => { diff --git a/static/lib/utility.js b/static/lib/utility.js index 5ae67826..6e8a32d7 100644 --- a/static/lib/utility.js +++ b/static/lib/utility.js @@ -9,11 +9,20 @@ export function getParameterByName(name, url) { } // ctx, entityImages[name].img, xPos, yPos, size.x, size.y, rotation, sprWidth, sprHeight, offLeft, offTop -export function drawImageWithRotation(ctx, image, x, y, w, h, degrees, sprWidth, sprHeight, offLeft, offTop){ +export function drawImageWithRotation(ctx, image, x, y, w, h, degrees, sprWidth, sprHeight, offLeft, offTop, flipX, flipY){ ctx.save(); ctx.translate(x+w/2, y+h/2); ctx.rotate(degrees*Math.PI/180.0); ctx.translate(-x-w/2, -y-h/2); + if(flipX) { + x -= x*2+sprWidth; + ctx.scale(-1, 1); + } + if(flipY){ + y -= y*2+sprHeight; + ctx.scale(1, -1); + } + if(sprWidth != undefined && sprHeight != undefined && offLeft != undefined && offTop != undefined){ // console.log(sprWidth+" "+sprHeight+" "+offLeft+" "+offTop+" "+w+" "+h) ctx.drawImage(image, offLeft, offTop, sprWidth, sprHeight, x, y, w, h); diff --git a/static/remoteMap.js b/static/remoteMap.js index 8caef5df..6a9d500a 100644 --- a/static/remoteMap.js +++ b/static/remoteMap.js @@ -372,7 +372,7 @@ function renderLoop(){ if(mousePosition && mousePosition.x){ // make a box around the mouse cursor selectionCtx.beginPath(); - selectionCtx.lineWidth = remoteMapConfig.tileSize / 8; + selectionCtx.lineWidth = remoteMapConfig.tileSize / 16; selectionCtx.strokeStyle="yellow"; if(mousePosition.clicked) selectionCtx.strokeStyle = "red"; if(mousePosition.rightClicked) selectionCtx.strokeStyle = "blue"; @@ -415,7 +415,8 @@ function drawEntity(entity, dontCache){ entityImages[name].draw = function(entity){ if(this.loaded){ let name = entity.entity.name; - let image, sprWidth, sprHeight, offLeft, offTop, size, offsetX, offsetY + let image, sprWidth, sprHeight, offLeft, offTop, size, offsetX, offsetY; + let flipX = false, flipY = false; let rotation = 0; // check hardcoded entity draw rules for specifics (otherwise draw icon as 1x1 entity with rotation if specified) if(entityDrawRules[name] && (entityDrawRules[name].positionOffset || entityDrawRules[name].spritesheet)){ @@ -431,24 +432,63 @@ function drawEntity(entity, dontCache){ }; } if(rules.spritesheet && Array.isArray(rules.spritesheet)){ - let dir = Number(entity.entity.rot); - // correct for whether we have 4 or 8 directions - let spriteSheetRotIndex = dir / (8 / rules.spritesheet.length); - - sprWidth = rules.spritesheet[spriteSheetRotIndex].spritesheet.frame.w; - sprHeight = rules.spritesheet[spriteSheetRotIndex].spritesheet.frame.h; - offLeft = rules.spritesheet[spriteSheetRotIndex].spritesheet.frame.x; - offTop = rules.spritesheet[spriteSheetRotIndex].spritesheet.frame.y; - image = global.spritesheet; - if(rules.spritesheet[spriteSheetRotIndex].positionOffset){ - offsetX = rules.spritesheet[spriteSheetRotIndex].positionOffset.x; - offsetY = rules.spritesheet[spriteSheetRotIndex].positionOffset.y; - } - if(rules.spritesheet[spriteSheetRotIndex].sizeInTiles){ - size = { - x: remoteMapConfig.tileSize * rules.spritesheet[dir/2].sizeInTiles.x, - y: remoteMapConfig.tileSize * rules.spritesheet[dir/2].sizeInTiles.y, - }; + let dir = Number(entity.entity.rot || 0); + // 2 animated sprites, we will need to flip it for rotations. + if(rules.spritesheet.length == 2){ + let spritesheetAnim = dir / 2 % 2; + let animationStage = Math.floor(Date.now()/16) % rules.spritesheet[spritesheetAnim].spritesheet.length; + + try{ + sprWidth = rules.spritesheet[spritesheetAnim].spritesheet[animationStage].frame.w; + sprHeight = rules.spritesheet[spritesheetAnim].spritesheet[animationStage].frame.h; + offLeft = rules.spritesheet[spritesheetAnim].spritesheet[animationStage].frame.x; + offTop = rules.spritesheet[spritesheetAnim].spritesheet[animationStage].frame.y; + } catch(e){ + // console.log(name) + // console.log(rules.spritesheet[spritesheetAnim].spritesheet) + } + image = global.spritesheet; + + // handle rotation (not handled by generic handler because we have to do flips and special stuff) + if(dir == 4){ + // rotation = (dir/2)*90 + // console.log("rotating") + flipY = true; + } else if(dir == 6){ + flipX = true; + // rotation = ((dir+2)/2)*90+180 // this formula is terrible, don't try to repair, there is no sense to it + } + + if(rules.spritesheet[spritesheetAnim].positionOffset){ + offsetX = rules.spritesheet[spritesheetAnim].positionOffset.x; + offsetY = rules.spritesheet[spritesheetAnim].positionOffset.y; + } + if(rules.spritesheet[spritesheetAnim].sizeInTiles){ + size = { + x: remoteMapConfig.tileSize * rules.spritesheet[spritesheetAnim].sizeInTiles.x, + y: remoteMapConfig.tileSize * rules.spritesheet[spritesheetAnim].sizeInTiles.y, + }; + } + } else { + // correct for whether we have 4 or 8 directions + let spriteSheetRotIndex = dir / (8 / rules.spritesheet.length); + + sprWidth = rules.spritesheet[spriteSheetRotIndex].spritesheet.frame.w; + sprHeight = rules.spritesheet[spriteSheetRotIndex].spritesheet.frame.h; + offLeft = rules.spritesheet[spriteSheetRotIndex].spritesheet.frame.x; + offTop = rules.spritesheet[spriteSheetRotIndex].spritesheet.frame.y; + image = global.spritesheet; + + if(rules.spritesheet[spriteSheetRotIndex].positionOffset){ + offsetX = rules.spritesheet[spriteSheetRotIndex].positionOffset.x; + offsetY = rules.spritesheet[spriteSheetRotIndex].positionOffset.y; + } + if(rules.spritesheet[spriteSheetRotIndex].sizeInTiles){ + size = { + x: remoteMapConfig.tileSize * rules.spritesheet[spriteSheetRotIndex].sizeInTiles.x, + y: remoteMapConfig.tileSize * rules.spritesheet[spriteSheetRotIndex].sizeInTiles.y, + }; + } } } else if(rules.spritesheet){ sprWidth = rules.spritesheet.frame.w; @@ -475,7 +515,7 @@ function drawEntity(entity, dontCache){ } if(!image) image = entityImages[name].img; // if(name == "oil-refinery") console.log(offsetX) - drawImageWithRotation(ctx, image, xPos, yPos, size.x, size.y, rotation%360, sprWidth, sprHeight, offLeft, offTop); + drawImageWithRotation(ctx, image, xPos, yPos, size.x, size.y, rotation%360, sprWidth, sprHeight, offLeft, offTop, flipX, flipY); //console.log("Drawing "+name+" at X: "+xPos+", Y: "+yPos+" with with rotation "+rotation); } else { // we are waiting for the image to load, push the task to our queue. It will be processed once the image loads. @@ -515,3 +555,4 @@ function clear(){ ctx.clearRect(0, 0, canvas.width, canvas.height); selectionCtx.clearRect(0, 0, selectionCanvas.width, selectionCanvas.height); } +// setInterval(()=>console.log(entityDrawRules),5000);