144 lines
3.7 KiB
JavaScript
144 lines
3.7 KiB
JavaScript
import * as lib from "./lib.js"
|
|
|
|
const playerSprite = await lib.texture.loadImage("assets/player.png");
|
|
const bulletSprite = await lib.texture.loadImage("assets/bullet1.png");
|
|
const enemySprite = await lib.texture.loadImage("assets/enemy1.png");
|
|
|
|
const explosionSprites = await Promise.all(
|
|
[1, 2, 3, 4]
|
|
.map((id) => lib.texture.loadImage(`assets/explosion${id}.png`))
|
|
.map((texture) => texture.then(texture => {
|
|
texture.width = 64;
|
|
texture.height = 64;
|
|
texture.multiplyPixelColor(1, 1, 0)
|
|
return texture;
|
|
})),
|
|
);
|
|
|
|
playerSprite.width = 64;
|
|
playerSprite.height = 64;
|
|
playerSprite.multiplyPixelColor(1, 0.5, 0);
|
|
|
|
bulletSprite.width = 32;
|
|
bulletSprite.height = 32;
|
|
bulletSprite.rotate(Math.PI);
|
|
|
|
enemySprite.width = 64;
|
|
enemySprite.height = 64;
|
|
enemySprite.multiplyPixelColor(0.2, 0.2, 1)
|
|
|
|
const playerSpeed = 300;
|
|
const bulletSpeed = 400;
|
|
|
|
let playerX = 0;
|
|
|
|
let bullets = [];
|
|
const bulletCoolDown = 0.5;
|
|
let bulletCooldownTimer = bulletCoolDown;
|
|
|
|
let enemies = [
|
|
{ x: 10, y: 0 },
|
|
{ x: 110, y: 0 },
|
|
{ x: 210, y: 0 },
|
|
{ x: 310, y: 0 },
|
|
{ x: 410, y: 0 },
|
|
{ x: 10, y: 100 },
|
|
{ x: 110, y: 100 },
|
|
{ x: 210, y: 100 },
|
|
{ x: 310, y: 100 },
|
|
{ x: 410, y: 100 },
|
|
];
|
|
|
|
let explosions = [];
|
|
const explosionDuration = 0.5;
|
|
|
|
function loop() {
|
|
|
|
const goLeft = lib.isPressed("ArrowLeft");
|
|
const goRight = lib.isPressed("ArrowRight");
|
|
if (goLeft && !goRight) {
|
|
playerX -= playerSpeed * lib.frameDeltaT;
|
|
if (playerX < 0) {
|
|
playerX = 0;
|
|
}
|
|
} else if (goRight && !goLeft) {
|
|
playerX += playerSpeed * lib.frameDeltaT;
|
|
if (playerX >= lib.canvas.width - playerSprite.width) {
|
|
playerX = lib.canvas.width - playerSprite.width;
|
|
}
|
|
}
|
|
|
|
for (const bullet of bullets) {
|
|
bullet.y -= bulletSpeed * lib.frameDeltaT
|
|
}
|
|
bulletCooldownTimer += lib.frameDeltaT;
|
|
|
|
let deadEnemies = []
|
|
let deadBullets = []
|
|
for (let enemyIdx = 0; enemyIdx < enemies.length; ++enemyIdx) {
|
|
|
|
const enemy = enemies[enemyIdx];
|
|
|
|
for (let bulletIdx = 0; bulletIdx < bullets.length; ++bulletIdx) {
|
|
const bullet = bullets[bulletIdx];
|
|
|
|
if (bullet.x < enemy.x + 64 && bullet.x + 32 >= enemy.x
|
|
&& bullet.y < enemy.y + 64 && bullet.y + 32 >= enemy.y) {
|
|
deadBullets.push(bulletIdx);
|
|
deadEnemies.push(enemyIdx);
|
|
explosions.push({ x: bullet.x, y: bullet.y, time: 0 });
|
|
}
|
|
|
|
}
|
|
}
|
|
for (const i of deadEnemies.toReversed()) {
|
|
enemies.splice(i, 1)
|
|
}
|
|
for (const i of deadBullets.toReversed()) {
|
|
bullets.splice(i, 1)
|
|
}
|
|
|
|
let deadExplosions = []
|
|
for (let i = 0; i < explosions.length; ++i) {
|
|
const explosion = explosions[i];
|
|
explosion.time += lib.frameDeltaT;
|
|
if (explosion.time > explosionDuration) {
|
|
deadExplosions.push(i);
|
|
}
|
|
}
|
|
for (const i of deadExplosions.toReversed()) {
|
|
explosions.splice(i, 1)
|
|
}
|
|
|
|
const cx = lib.canvas;
|
|
|
|
cx.clear("black");
|
|
|
|
cx.putTexture(playerSprite, playerX, 300);
|
|
|
|
for (const bullet of bullets) {
|
|
cx.putTexture(bulletSprite, bullet.x, bullet.y);
|
|
}
|
|
|
|
for (const enemy of enemies) {
|
|
cx.putTexture(enemySprite, enemy.x, enemy.y);
|
|
}
|
|
|
|
for (const explosion of explosions) {
|
|
const idx = Math.floor(explosionSprites.length * (explosion.time / explosionDuration));
|
|
const texture = explosionSprites[idx];
|
|
cx.putTexture(texture, explosion.x - 32, explosion.y - 32);
|
|
}
|
|
}
|
|
|
|
lib.onPress(" ", () => {
|
|
if (bulletCooldownTimer < bulletCoolDown)
|
|
return;
|
|
bullets.push({ x: playerX + 16, y: 300 });
|
|
bulletCooldownTimer = 0;
|
|
})
|
|
|
|
lib.startGame(loop);
|
|
|
|
|