[WIP] Start working on shots
This commit is contained in:
parent
5a2638a15d
commit
0d5c742cb4
@ -25,8 +25,6 @@ export class CollisionManager {
|
||||
checkCollisionForShots(xMin, xMax, yMin, yMax) {
|
||||
}
|
||||
|
||||
|
||||
|
||||
_checkTankCollision(xMin, xMax, yMin, yMax) {
|
||||
//TODO with AI tanks
|
||||
return null;
|
||||
@ -40,10 +38,6 @@ export class CollisionManager {
|
||||
return null;
|
||||
}
|
||||
|
||||
_checkShotCollision(xMin, xMax, yMin, yMax) {
|
||||
return null;
|
||||
}
|
||||
|
||||
_checkBlockCollision(xMin, xMax, yMin, yMax) {
|
||||
const blocksToCheck = this._getAllElementsOfMapOn(xMin, xMax, yMin, yMax);
|
||||
const tilesize = Constants.TILE_SIZE.getValue();
|
||||
@ -71,9 +65,9 @@ export class CollisionManager {
|
||||
for (let y = 0; y < this._map.height; y++) {
|
||||
if (this.intersect(xMin, xMax, yMin, yMax, x * tilesize, (x + 1) * tilesize, y * tilesize, (y + 1) * tilesize))
|
||||
elements.push({
|
||||
"block": this._map.getElement(x, y),
|
||||
"xPos": x,
|
||||
"yPos": y
|
||||
block: this._map.getElement(x, y),
|
||||
xPos: x,
|
||||
yPos: y
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
@ -9,6 +9,7 @@ export class TankKeyAdapter extends GameKeyAdapterInterface {
|
||||
}
|
||||
|
||||
handleEvent(event) {
|
||||
console.log(event.key);
|
||||
switch (event.key) {
|
||||
case "ArrowLeft":
|
||||
this.tank.move(DirectionEnum.Left);
|
||||
@ -22,6 +23,8 @@ export class TankKeyAdapter extends GameKeyAdapterInterface {
|
||||
case "ArrowDown":
|
||||
this.tank.move(DirectionEnum.Down);
|
||||
break;
|
||||
case "Control":
|
||||
this.tank.shot();
|
||||
}
|
||||
|
||||
//console.log(event.key);
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
import { Constants } from "../constants";
|
||||
import { DirectionEnum } from "./directionEnum";
|
||||
import { ShotManager } from "./shotElement";
|
||||
|
||||
export class PlayerTank {
|
||||
|
||||
@ -9,6 +10,8 @@ export class PlayerTank {
|
||||
this.collisionManager = collisionManager;
|
||||
this.speed = 3.0;
|
||||
this.direction = DirectionEnum.Up;
|
||||
|
||||
this.shotManager = new ShotManager(collisionManager, this);
|
||||
}
|
||||
|
||||
move(direction) {
|
||||
@ -45,9 +48,36 @@ export class PlayerTank {
|
||||
}
|
||||
}
|
||||
|
||||
shot() {
|
||||
let x, y = 0
|
||||
const tanksize = Constants.TANK_SIZE.getValue();
|
||||
|
||||
switch (this.direction) {
|
||||
case DirectionEnum.Up:
|
||||
x = this.x + tanksize / 2;
|
||||
y = this.y;
|
||||
break;
|
||||
case DirectionEnum.Left:
|
||||
x = this.x;
|
||||
y = this.y + tanksize / 2;
|
||||
break;
|
||||
case DirectionEnum.Down:
|
||||
x = this.x + tanksize / 2;
|
||||
y = this.y + tanksize;
|
||||
break;
|
||||
case DirectionEnum.Right:
|
||||
x = this.x + tanksize;
|
||||
y = this.y + tanksize / 2;
|
||||
break;
|
||||
}
|
||||
|
||||
this.shotManager.tryShot(this.direction, x, y);
|
||||
}
|
||||
|
||||
draw(tileset, ctx) {
|
||||
ctx.drawImage(tileset.getImageOf(100 + this.direction.getValue()), this.x, this.y,
|
||||
Constants.TANK_SIZE.getValue(), Constants.TANK_SIZE.getValue());
|
||||
Constants.TANK_SIZE.getValue(), Constants.TANK_SIZE.getValue());
|
||||
this.shotManager.draw(ctx);
|
||||
}
|
||||
|
||||
}
|
||||
107
src/Tanks/shotElement.js
Normal file
107
src/Tanks/shotElement.js
Normal file
@ -0,0 +1,107 @@
|
||||
import { Constants } from "../constants";
|
||||
import { DirectionEnum } from "./directionEnum";
|
||||
|
||||
class Shot {
|
||||
constructor(shotManager, direction, x, y) {
|
||||
this.image = ShotVisualElement.createShot(direction);
|
||||
this.shotManager = shotManager;
|
||||
this.direction = direction;
|
||||
this.x = x;
|
||||
this.y = y;
|
||||
this.speed = Constants.SHOT_SPEED.getValue();
|
||||
}
|
||||
|
||||
move() {
|
||||
switch (this.direction) {
|
||||
case DirectionEnum.Up:
|
||||
if (!this.shotManager.checkCollision(this.x, this.x + 4, this.y - this.speed, this.y + 4 - this.speed))
|
||||
this.y -= this.speed;
|
||||
else this.shotManager.destroyShot();
|
||||
break;
|
||||
|
||||
case DirectionEnum.Left:
|
||||
if (!this.shotManager.checkCollision(this.x - this.speed, this.x + 4 - this.speed, this.y, this.y + 4))
|
||||
this.x -= this.speed;
|
||||
else this.shotManager.destroyShot();
|
||||
break;
|
||||
|
||||
case DirectionEnum.Right:
|
||||
if (!this.shotManager.checkCollision(this.x + this.speed, this.x + 4 + this.speed, this.y, this.y + 4))
|
||||
this.x += this.speed;
|
||||
else this.shotManager.destroyShot();
|
||||
break;
|
||||
|
||||
case DirectionEnum.Down:
|
||||
if (!this.shotManager.checkCollision(this.x, this.x + 4, this.y + this.speed, this.y + 4 + this.speed))
|
||||
this.y += this.speed;
|
||||
else this.shotManager.destroyShot();
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
export class ShotManager {
|
||||
constructor(collisionManager, tank) {
|
||||
this.collisionManager = collisionManager;
|
||||
this.tank = tank;
|
||||
this.shot = null;
|
||||
}
|
||||
|
||||
tryShot(direction, x, y) {
|
||||
if (!this.shot) {
|
||||
this.shot = new Shot(this, direction, x, y);
|
||||
}
|
||||
}
|
||||
|
||||
checkCollision(minX, maxX, minY, maxY) {
|
||||
return this.collisionManager.checkCollisionForTank(minX, maxX, minY, maxY);
|
||||
}
|
||||
|
||||
destroyShot() {
|
||||
this.shot = null;
|
||||
}
|
||||
|
||||
draw(ctx) {
|
||||
if (this.shot)
|
||||
this.shot.move();
|
||||
|
||||
if (this.shot)
|
||||
ctx.drawImage(this.shot.image, this.shot.x, this.shot.y);
|
||||
}
|
||||
}
|
||||
|
||||
class ShotVisualElement {
|
||||
static createShot(direction) {
|
||||
let canvas = document.createElement("canvas");
|
||||
canvas.width = 4;
|
||||
canvas.height = 4;
|
||||
let ctx = canvas.getContext("2d");
|
||||
ctx.fillStyle = "BLACK";
|
||||
ctx.fillRect(0, 0, 4, 4);
|
||||
|
||||
ctx.fillStyle = "GREY";
|
||||
switch (direction) {
|
||||
case DirectionEnum.Up:
|
||||
ctx.fillRect(0, 1, 4, 3);
|
||||
ctx.fillRect(1, 0, 2, 1);
|
||||
break;
|
||||
case DirectionEnum.Left:
|
||||
ctx.fillRect(1, 0, 3, 4);
|
||||
ctx.fillRect(0, 1, 1, 2);
|
||||
break;
|
||||
case DirectionEnum.Down:
|
||||
ctx.fillRect(0, 0, 4, 3);
|
||||
ctx.fillRect(1, 3, 2, 1);
|
||||
break;
|
||||
case DirectionEnum.Right:
|
||||
ctx.fillRect(0, 0, 3, 4);
|
||||
ctx.fillRect(3, 1, 1, 2);
|
||||
break;
|
||||
}
|
||||
|
||||
let img = new Image();
|
||||
img.src = canvas.toDataURL("image/png");
|
||||
return img;
|
||||
}
|
||||
}
|
||||
@ -2,6 +2,7 @@ export class Constants {
|
||||
static TILE_SIZE = new Constants(32);
|
||||
static TANK_SIZE = new Constants(24);
|
||||
static TANK_COLL_OFFSET = new Constants(0.125);
|
||||
static SHOT_SPEED = new Constants(3.0);
|
||||
|
||||
constructor(value){
|
||||
this._value = value;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user