loop.js

engine.highlightSelection = function(xFrom, yFrom, xTo, yTo) {
  engine.clearHighlight();
  for (var x=xFrom; x < xTo; x++) {
    for (var y=yFrom; y < yTo; y++) {
      var posX = (x-1) * engine.tileW;
      var posY = (y-1) * engine.tileH;
      engine.overlayContext.beginPath();
      engine.overlayContext.rect(posX, posY, engine.tileW, engine.tileH);
      engine.overlayContext.fillStyle = 'rgba(0, 0, 0, 0.4)';
      engine.overlayContext.fill();
    }
  }
  var posX = (x-1) * engine.tileW;
  var posY = (y-1) * engine.tileH;
  engine.overlayContext.beginPath();
  engine.overlayContext.rect(posX, posY, (engine.tileW*(xFrom-xTo)), engine.tileH*(yFrom-yTo));
  engine.overlayContext.fillStyle = 'rgba(0, 0, 0, 0.4)';
  engine.overlayContext.fill();
  engine.overlayContext.lineWidth = 1;
  engine.overlayContext.strokeStyle = 'white';
  engine.overlayContext.stroke();
}