Hecc-inc./caa-game
3
0
Fork 0
Code Issues Pull Requests Releases 1 Wiki Activity

Updated movement and added textures by Job

Browse Source
This commit is contained in:
Arne van Iterson 2020-03-22 15:54:55 +01:00
parent 98462b4c3f
commit 61f7a91cca
9 changed files with 148 additions and 98 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
package-lock.json generated
View File

@ -151,9 +151,9 @@
}
},
"asdf-games": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/asdf-games/-/asdf-games-1.0.1.tgz",
"integrity": "sha512-+7b+Na5rcAJg/zhLK+VuQ5WWtMxwGvYNdGSLLRbcNZai1Hdf2GDiXYV0xHi64WCxV4YdeRI0ymBOtyPME0OimA=="
"version": "1.0.5",
"resolved": "https://registry.npmjs.org/asdf-games/-/asdf-games-1.0.5.tgz",
"integrity": "sha512-dRjnLUvjd7umMShBOmitgJhyo9LA2pKgDa1if5Zshd9y6Exj0LcfY0f8WJpA8cxXYlMq3duiT3lE1bFrgtifow=="
},
"astral-regex": {
"version": "1.0.0",

2
package.json
View File

@ -10,7 +10,7 @@
"author": "McArn",
"license": "ISC",
"dependencies": {
"asdf-games": "^1.0.1"
"asdf-games": "^1.0.5"
},
"devDependencies": {
"electron": "^8.0.2",

BIN
res/dungeon_tiles.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 14 KiB

BIN
res/placeholder.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 243 B

42
res/tilemap.min.js vendored Normal file
View File

@ -0,0 +1,42 @@
/** -------------------------------------------------------------------
* Tile map for caa-game
* Index for tilemap file
*
* 0. Corner top-left
* 1. normal top wall middle piece
* 2. Corner top -> left wall
* 3. Left wall
* 4. top wall before corner
* 5. corner top -> right wall
* 6. normal right wall piece
* 7. Corner right -> top
* 8. Corner right -> bottom
* 9. bottom wall piece before 8.
* 10. normal bottom wall piece
* 11. Corner bottom -> right
* 12. Corner right -> bottom
* 13. Corner bottom -> left
* 14. Bottom wall piece before 13.
* 15. Corner left -> bottom
* 16. Normal floor tile
* 17. +-shaped floor tile
* 18. Heavily cracked floor tile
* 19. Lightly cracked floor tile
* 20. Normal brick wall 1
* 21. Normal brick wall 2
* 22. Normal brick wall 3
* 23. blood brick wall 1
* 24. blood brick wall 2
* 25. blood brick wall 3
* 26. light vines brick wall 1
* 27. light vines brick wall 2
* 28. light vines brick wall 3
* 29. heavy vines brick wall 1
* 30. heavy vines brick wall 2
* 31. heavy vines brick wall 3
* 32. Chest closed
* 33. Chest opened
* 34. Rock 1
* 35. Rock 2
------------------------------------------------------------------- */
module.exports=[{x:0,y:0,walkable:!1},{x:16,y:0,walkable:!1},{x:32,y:0,walkable:!1},{x:48,y:0,walkable:!1},{x:64,y:0,walkable:!1},{x:0,y:16,walkable:!1},{x:16,y:16,walkable:!1},{x:32,y:16,walkable:!1},{x:48,y:16,walkable:!1},{x:64,y:16,walkable:!1},{x:0,y:32,walkable:!1},{x:16,y:32,walkable:!1},{x:32,y:32,walkable:!1},{x:48,y:32,walkable:!1},{x:64,y:32,walkable:!1},{x:0,y:48,walkable:!1},{x:16,y:48,walkable:!0},{x:32,y:48,walkable:!0},{x:48,y:48,walkable:!0},{x:64,y:48,walkable:!0},{x:0,y:64,walkable:!1},{x:16,y:64,walkable:!1},{x:32,y:64,walkable:!1},{x:48,y:64,walkable:!1},{x:64,y:64,walkable:!1},{x:0,y:80,walkable:!1},{x:16,y:80,walkable:!1},{x:32,y:80,walkable:!1},{x:48,y:80,walkable:!1},{x:64,y:80,walkable:!1},{x:0,y:96,walkable:!1},{x:16,y:96,walkable:!1},{x:32,y:96,walkable:!1},{x:48,y:96,walkable:!1},{x:64,y:96,walkable:!1},{x:0,y:112,walkable:!1}];

BIN
res/tilemap.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.3 KiB

122
src/entities/player.js
View File

@ -1,79 +1,87 @@
var asdf = require("asdf-games");
const { Texture, TileSprite } = asdf;
const { Texture, TileSprite, AnimManager } = asdf;
var texture = new Texture("./res/player.png");
class Player extends TileSprite {
constructor(keys, window) {
constructor(keys, window, level) {
super(texture, 24, 24);
this.scale = { x: 2, y: 2 };
this.window = window;
// Rate walking = 0.4
// Rate running = 0.08
this.rate = {
walking: 0.2,
running: 0.08
};
this.rate = 1;
this.direction = 1;
this.frames = [
{ x: 0, y: 1 },
{ x: 1, y: 1 },
{ x: 2, y: 1 },
{ x: 3, y: 1 }
];
this.curTime = 0;
this.curFrame = 0;
this.frame = this.frames[this.curFrame];
this.anims = new AnimManager(this);
// North
this.anims.add("walk_n", [0, 1, 2, 3].map(x => ({ x, y: 0 })), this.rate.walking);
this.anims.add("run_n", [0, 1, 2, 3].map(x => ({ x, y: 0 })), this.rate.running);
// East
this.anims.add("walk_e", [0, 1, 2, 3].map(x => ({ x, y: 2 })), this.rate.walking);
this.anims.add("run_e", [0, 1, 2, 3].map(x => ({ x, y: 2 })), this.rate.running);
// South
this.anims.add("walk_s", [0, 1, 2, 3].map(x => ({ x, y: 1 })), this.rate.walking);
this.anims.add("run_s", [0, 1, 2, 3].map(x => ({ x, y: 1 })), this.rate.running);
// West
this.anims.add("walk_w", [0, 1, 2, 3].map(x => ({ x, y: 3 })), this.rate.walking);
this.anims.add("run_w", [0, 1, 2, 3].map(x => ({ x, y: 3 })), this.rate.running);
this.anims.play("walk_s");
this.pos.x = (this.window.w / 2) - (24 * this.scale.x / 2);
this.pos.y = (this.window.h / 2) - (24 * this.scale.y / 2);
this.pos.x = (level.w / 2) - (24 * this.scale.x / 2);
this.pos.y = (level.h / 2) - (24 * this.scale.y / 2);
this.keys = keys;
}
update(dt) {
const { rate, frames } = this;
this.curTime += dt;
// Change speed
if (this.keys.x || this.keys.y) {
// Walking
this.rate = 0.35;
} else {
// Standstill
this.curFrame = 0;
}
if (this.keys.action && (this.keys.x || this.keys.y)) {
// Running
this.rate = 0.08;
}
// Change walking direction
if (this.keys.x == -1) {
// Left
this.direction = 3;
}
if (this.keys.x == 1) {
// Right
this.direction = 2;
}
if (this.keys.y == -1) {
// Down
this.direction = 0;
}
if (this.keys.y == 1) {
// Up
this.direction = 1;
}
this.frames.forEach(element => {
element.y = this.direction;
});
super.update(dt);
// Animate
if (this.curTime > rate) {
this.frame = frames[this.curFrame++ % frames.length];
this.curTime -= rate;
if (this.keys.x == -1) {
// Left
(this.keys.action) ?
this.anims.play("run_w") : this.anims.play("walk_w");
} else if (this.keys.x == 1) {
// Right
(this.keys.action) ?
this.anims.play("run_e") : this.anims.play("walk_e");
} else if (this.keys.y == -1) {
// Up
(this.keys.action) ?
this.anims.play("run_n") : this.anims.play("walk_n");
} else if (this.keys.y == 1) {
// Down
(this.keys.action) ?
this.anims.play("run_s") : this.anims.play("walk_s");
} else {
// Idle
this.anims.stop();
}
// Move
if (this.keys.x == -1) {
// Left
this.pos.x += this.keys.x * dt * (600 * (1 - (this.keys.action) ?
this.rate.running : this.rate.walking ));
}
if (this.keys.x == 1) {
// Right
this.pos.x += this.keys.x * dt * (600 * (1 - (this.keys.action) ?
this.rate.running : this.rate.walking ));
}
if (this.keys.y == -1) {
// Up
this.pos.y += this.keys.y * dt * (600 * (1 - (this.keys.action) ?
this.rate.running : this.rate.walking ));
}
if (this.keys.y == 1) {
// Down
this.pos.y += this.keys.y * dt * (600 * (1 - (this.keys.action) ?
this.rate.running : this.rate.walking ));
}
}
}

12
src/game.js
View File

@ -1,7 +1,7 @@
const { ipcRenderer, remote } = require("electron");
var asdf = require("asdf-games");
const { Game, KeyControls, MouseControls } = asdf;
const { Game, KeyControls, MouseControls, Camera } = asdf;
const window = { w: 640, h: 320 };
@ -16,11 +16,13 @@ var Level = require("./src/levels/level.js");
const mouseAim = new MouseControls(document.getElementById("board"));
const keys = new KeyControls();
var player = new Player(keys, window);
var level = new Level(window, keys, player);
var level = new Level();
var player = new Player(keys, window, level);
const camera = new Camera(player, window, { w: level.w * level.scale.x, h: level.h * level.scale.y });
scene.add(level);
scene.add(player);
scene.add(camera);
camera.add(level);
camera.add(player);
game.run(() => {
if (mouseAim.isDown) {

62
src/levels/level.js
View File

@ -1,43 +1,41 @@
var asdf = require("asdf-games");
const { Texture, TileMap } = asdf;
const texture = new Texture("./res/placeholder.png");
const texture = new Texture("./res/tilemap.png");
const tiles = require("../../res/tilemap.min.js");
const levelSize = { w: 640, h: 320 };
var levelData = [];
const levelSize = { w: 480, h: 240 };
var levelData = [
0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 5,
3, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 6,
3, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 6,
3, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 6,
3, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 6,
3, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 6,
3, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 6,
3, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 6,
3, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 6,
3, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 6,
3, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 6,
3, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 6,
3, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 6,
3, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 6,
13, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 10, 9, 8
];
for (let index = 0; index < ((levelSize.w / 32) * (levelSize.h / 32)); index++) {
levelData.push({ x: 0, y: 0 });
}
var levelTiles = levelData.map(function(e) {
return { x: (tiles[e].x / 16), y: (tiles[e].y / 16), walkable: tiles[e].walkeable };
});
console.log(levelTiles);
class Level extends TileMap {
constructor (window, keys, player) {
super(levelData, levelSize.w / 32, levelSize.h / 32, 32, 32, texture);
this.pos.x = (window.w / 2) - (levelSize.w / 2);
this.pos.y = (window.h / 2) - (levelSize.h / 2);
constructor () {
super(levelTiles, levelSize.w / 16, levelSize.h / 16, 16, 16, texture);
this.pos = { x: 0, y: 0 };
this.w = levelSize.w;
this.h = levelSize.h;
this.scale = { x: 2, y: 2 };
this.keys = keys;
this.player = player;
}
update(dt) {
// Change walking direction
if (this.keys.x == -1) {
// Left
this.pos.x = this.pos.x + dt * (1 / this.player.rate) * 10;
}
if (this.keys.x == 1) {
// Right
this.pos.x = this.pos.x - dt * (1 / this.player.rate) * 10;
}
if (this.keys.y == -1) {
// Down
this.pos.y = this.pos.y + dt * (1 / this.player.rate) * 10;
}
if (this.keys.y == 1) {
// Up
this.pos.y = this.pos.y - dt * (1 / this.player.rate) * 10;
}
}
}