From 164bd0eac8596f9ccc49d9c5b8ff5d3dcfa83381 Mon Sep 17 00:00:00 2001
From: Bye <bye@byecorps.com>
Date: Wed, 23 Aug 2023 21:22:03 +0100
Subject: [PATCH] day 10
---
assets/boats.ase | Bin 873 -> 1503 bytes
package.json | 2 +-
src/img/boats.webp | Bin 72 -> 170 bytes
src/js/game.js | 96 +++++++++++++++++++++++++++++++--------------
src/js/objects.js | 9 ++++-
src/js/utils.js | 13 ++++++
6 files changed, 87 insertions(+), 33 deletions(-)
diff --git a/assets/boats.ase b/assets/boats.ase
index 8d093468dbffe22920f36ff148e1f72b7535deca..75652bafe3308cddaeb6f2eb373600e032d9b30b 100644
GIT binary patch
delta 278
zcmaFKcAuO5J}U#mgQaX6*^`(B>lqjretl$ONMT@LU}9iku%FDxtSk68zU6>{Vb-eT
z1CPWQEDm_(O}1oKP%M~J^246Tc)`a+35Kj_k(I4zdR;+!#V2aBE&8wTlrTePm&A#@
zl)Vae3?C-=)PhV<KsN#1_DRf^jAoOqnB~<#D*rF~KmUJo2AhU_Bu@+DluWUuxYh4?
zJL5<F<c5Rw0=!R*8g9IhU@&zRm|ueCLXi2|ldYI#c^R7jdq~XXKgQ6!g#9M~od{QO
delta 16
Xcmcc5{gRD6lbM0x!BWPJ>`BZ3E=dIN
diff --git a/package.json b/package.json
index 2a01f74..cc4258e 100644
--- a/package.json
+++ b/package.json
@@ -12,7 +12,7 @@
"build:zipSize": "node scripts/zipSize.js",
"start": "npm-run-all -s clean -p dev:*",
"dev:js": "esbuild src/js/game.js --bundle --format=iife --loader:.webp=dataurl --sourcemap --outfile=dist/game.js --watch",
- "dev:serve_watch_html_js": "browser-sync dist src --watch --host 0.0.0.0 --https",
+ "dev:serve_watch_html_js": "browser-sync dist src --watch --host 0.0.0.0 --https --open false",
"dev:watch_img": "chokidar src/img -d 0 -c 'npm run dev:js'"
},
"license": "MIT",
diff --git a/src/img/boats.webp b/src/img/boats.webp
index 72b20efac1aae83eb6df4fbaa4743d798d3c34ca..1fe6040877aaa6e1bf278dd1b2756eec365806f8 100644
GIT binary patch
literal 170
zcmWIYbaPw8z`zjh>J$(bVBs^3fq_9^_5ibh|AGk<Ri26LYxpzKKH_*FkEhUPj@5;1
zA4@MSpQ3VtMW<|)a>JTK9gC0rVP|Og`ds(Wf(ReOkESab&9-he|G7z3*_GjWxFDmT
zgYbbXJQJoK{?hNGS@kkOVbTAr%Vr6e)FwM`>sYaF$IAY_yC1IE?_@vo=C0Q}FFoAz
e`n-F^%ccWGi5ZdGJXkKC+HER5S)KEr2?GGDU`|Q^
literal 72
zcmWIYbaQiHU|<M$bqWXzu<$WvU|`T^IlwF+uOOfhJW1z<l7PaKjKU{%*Ph!qT)VMg
dMXvJ6#S1M|+8=M+e^lV&e+}9FOpjF=7yv0{8oB@g
diff --git a/src/js/game.js b/src/js/game.js
index 3fdbcf5..4253d4e 100644
--- a/src/js/game.js
+++ b/src/js/game.js
@@ -9,7 +9,7 @@ import {
getDirectionBetweenTwoPoints,
degreesToRadians,
randomInt,
- calculateDistanceBetweenTwoPoints
+ calculateDistanceBetweenTwoPoints, findDuplicateIds
} from "./utils.js";
import { getMousePos } from "./inputs/mouse.js";
import { isKeyUp, whichKeyDown } from "./inputs/keyboard.js";
@@ -188,25 +188,29 @@ menuRoom.keyDown = (key) => {
}
class Boat extends Entity {
- constructor(x, y, sprite, speed =1 ) {
- super(randomInt(100, 10000), x, y);
+ constructor(x, y, sprite, speed =1, id=randomInt(100, 10000), target={x:0,y:0}) {
+ super(id, x, y);
this.boatbody = 0;
this.boatsail = 0;
this.sprite = sprite;
this.speed = speed;
- this.target = {x: canvas.width/2, y: canvas.height/2}
+ if (speed === 0) speed = 0.5;
+ this.stepspeed = randomInt(Math.floor(100/speed), Math.floor(1000/speed));
+ this.target = target;
}
step() {
- debugStatuses.push(`Speed:${this.speed}, XY: ${this.x}, ${this.y}`)
- if (!(currentFrame % randomInt(30, 120))) {
+ if (!(currentFrame % this.stepspeed)) {
this.direction = getDirectionBetweenTwoPoints(this.x, this.y, this.target.x, this.target.y);
- this.x += this.speed * Math.cos(this.direction);
- this.y += this.speed * Math.sin(this.direction);
+ this.x += 2 * Math.cos(this.direction);
+ this.y += 2 * Math.sin(this.direction);
}
- if (calculateDistanceBetweenTwoPoints(this.x, this.y, this.target.x, this.target.y) < 5) gameRoom.destroy(this.id);
+ if (calculateDistanceBetweenTwoPoints(this.x, this.y, this.target.x, this.target.y) < 5) {
+ console.debug(`${this.id} is going bye-bye!`);
+ gameRoom.remove(this.id);
+ }
}
draw() {
@@ -214,7 +218,7 @@ class Boat extends Entity {
canvas.sliceImage(this.sprite, this.x-2.5, this.y-4, 5, 8, (5*this.boatbody), 0, 5, 8, displayDirection); //body
canvas.sliceImage(this.sprite, this.x-2.5, this.y-4, 5, 8, (5*this.boatsail), 8, 5, 8, displayDirection); //sail
- if (debug) canvas.drawLine(this.x, this.y, this.target.x, this.target.y);
+ if (debug) text.render(`${this.id}`, this.x - 2, this.y - 2);
}
onclick(pos) {
@@ -222,32 +226,49 @@ class Boat extends Entity {
}
}
+const endRoom = new Room("end");
+endRoom.background = "#3051820A"
+endRoom.drawGUI = () => {
+ const words = "You won! Well done.";
+ text.render(words, (canvas.width/2)-((words.length*6)/2), 40);
+}
+endRoom.wonGame = () => {
+ changeRoom(searchForRoom("end"));
+}
+
const gameRoom = new Room("game");
-gameRoom.wave = 0;
+gameRoom.wave = getParameter("wave");
+if (!gameRoom.wave) gameRoom.wave = 0;
+
+const validTargets = [
+ {x: 92, y: 97},
+ {x: 240, y: 120}
+]
+
+gameRoom.wavePendingStart = 0;
gameRoom.boatCount = 0;
gameRoom.boatSpeed = 0;
-gameRoom.destory = id => {
- gameRoom.objects.findIndex(x => x.id === id);
-}
+console.log(typeof(gameRoom.remove))
gameRoom.startWave = _ => {
let { wave, boatCount, boatSpeed } = gameRoom;
+ gameRoom.wavePendingStart = 0;
boatCount = Math.floor(1 + (wave * 4));
- boatSpeed = 1 + (wave * 1.1);
+ boatSpeed = 3 + (wave * 1.1);
for (let i = 0; i <= boatCount; i++) {
const randomDirection = degreesToRadians(Math.random()*360);
const boatX = canvas.width/2 + (randomInt(150, 250) * Math.cos(randomDirection));
const boatY = canvas.height/2 + (randomInt(150, 250) * Math.sin(randomDirection));
+ const boatTarget = validTargets[Math.floor(Math.random()*validTargets.length)];
console.debug(`Boat ${i}: ${boatX}, ${boatY}`)
- gameRoom.objects.push(new Boat(boatX, boatY, assets.images.boats, boatSpeed));
+ gameRoom.objects.push(new Boat(boatX, boatY, assets.images.boats, boatSpeed, i*100, boatTarget));
}
- console.log(typeof(gameRoom.objects[0]))
}
-gameRoom.init = _ => gameRoom.startWave();
+// gameRoom.init = _ => gameRoom.startWave();
gameRoom.background = "#305182"
gameRoom.draw = () => {
@@ -262,8 +283,8 @@ gameRoom.step = _ => {
if (item.constructor.name === "Boat") numberOfBoats++;
item.step();
}
- console.log(numberOfBoats);
- // if (numberOfBoats === 0) {gameRoom.wave++; setTimeout(gameRoom.startWave, 3000)}
+ if (numberOfBoats === 0 && !gameRoom.wavePendingStart) {gameRoom.wave++; gameRoom.wavePendingStart=1; setTimeout(gameRoom.startWave, 3000)};
+ if (gameRoom.wave >= 401) endRoom.wonGame();
}
gameRoom.drawGUI = () => {
debugStatuses.push("Current wave:"+gameRoom.wave);
@@ -275,15 +296,25 @@ gameRoom.onclick = (pos) => {
}
}
-rooms.push(loadingRoom, menuRoom, debugRoom, gameRoom);
+
+
+
+rooms.push(loadingRoom, menuRoom, debugRoom, gameRoom, endRoom);
currentRoom = rooms[roomIndex];
-canvas.canvas.addEventListener('mousedown', function(evt) {
+let lastMousePos = {x:0,y:0}
+
+const sendMouseToCurrentRoom = evt => {
const mousePos = getMousePos(canvas.canvas, evt);
currentRoom.onclick(mousePos);
-}, false);
+}
+canvas.canvas.addEventListener('mousedown', evt=>sendMouseToCurrentRoom(evt), false);
+canvas.canvas.addEventListener('mousemove', evt => {
+ const mousePos = getMousePos(canvas.canvas, evt);
+ lastMousePos={x:mousePos.x,y:mousePos.y}
+})
let main = () => { // main game loop
@@ -300,6 +331,8 @@ let main = () => { // main game loop
canvas.fill(currentRoom.background);
+ currentRoom.draw();
+
currentRoom.drawGUI();
let currentKeys = whichKeyDown();
@@ -309,14 +342,20 @@ let main = () => { // main game loop
currentRoom.keyDown(currentKeys[i]);
}
- pressedLastFrame = currentKeys;
-
+ pressedLastFrame = currentKeys;
+
+ const fps = Math.round(1000 / delta);
+ let fpsColor;
+ (fps > 50) ? fpsColor = "#0d7200" : "#b24d0d";
+ (fps < 40) ? fpsColor = "#8a0000" : "#b24d0d";
+ canvas.drawRect(0,0,20,5, fpsColor);
+ text.render(`${fps}/${targetFrames}FPS`, 0, 0);
if (debug) {
- text.render(`${Math.round(1000 / delta)}/${targetFrames}FPS`, 0, 0);
text.render(currentRoom.name, canvas.width-(text.charWidth*(currentRoom.name.length)), 0);
debugStatuses.push("Debug mode");
-
+ if (findDuplicateIds(gameRoom.objects).length >= 1) debugStatuses.push(`WARN:Duplicate values found.${findDuplicateIds(gameRoom.objects).length}`);
+ debugStatuses.push(`MousePos:${Math.round(lastMousePos.x)},${Math.round(lastMousePos.y)}`);
}
// console.debug(debugStatuses);
@@ -339,9 +378,6 @@ let main = () => { // main game loop
debugStatuses.splice(index);
}
- currentRoom.draw();
-
-
lastFrameTime = now;
}
diff --git a/src/js/objects.js b/src/js/objects.js
index f306a4b..6ccb04a 100644
--- a/src/js/objects.js
+++ b/src/js/objects.js
@@ -17,8 +17,13 @@ class Room extends GameObject {
init(){}
- destory(id=99999999) {
- this.objects.findIndex(x => x.id === id);
+ remove(id = 99999999) {
+ let foundIndex = this.objects.findIndex(x => x.id === id);
+ console.debug(`Searched for ${id}, found at index ${foundIndex}`);
+
+ if (foundIndex !== -1) this.objects.splice(foundIndex, 1);
+
+ console.debug(this.objects);
}
draw() {
diff --git a/src/js/utils.js b/src/js/utils.js
index ef4ebdd..e0dce31 100644
--- a/src/js/utils.js
+++ b/src/js/utils.js
@@ -10,6 +10,19 @@ export const degreesToRadians = degrees => degrees * pi / 180;
export const randomInt = (min, max) => Math.floor(Math.random() * (max - min + 1)) + min;
+export const findDuplicateIds = (objectsArray) => {
+ const idOccurrences = {}; // Object to store ID occurrences
+
+ // Iterate through the array and count occurrences of each ID
+ objectsArray.forEach(obj => {
+ const id = obj.id;
+ idOccurrences[id] = (idOccurrences[id] || 0) + 1;
+ });
+
+ // Filter out IDs with occurrences greater than 1
+ return Object.keys(idOccurrences).filter(id => idOccurrences[id] > 1);
+}
+
export const getDirectionBetweenTwoPoints = (x1, y1, x2, y2) => {
const dX = x2 - x1;
const dY = y2 - y1;
--
GitLab