it's a zombie game now

master
Jordan Orelli 5 years ago
parent 23ed3541f5
commit 7c14f7e46c

@ -0,0 +1,15 @@
class Bank {
constructor() {
}
draw(x, y, w, h) {
tint(Colors.Purple);
let purple = color(Colors.Purple);
noFill();
stroke(purple);
strokeWeight(2);
rect(x, y, w, h);
image(Images.bank, x, y, w, h);
}
}

@ -1,19 +0,0 @@
// Frame represents an embroidery frame
class Frame {
constructor(options) {
this.x = options.x;
this.y = options.y;
this.width = options.width;
this.height = options.height;
}
draw() {
stroke(Colors.DarkTan);
strokeWeight(4);
fill(Colors.Tan);
rectMode(CORNERS);
rect(this.x, this.y, this.width, this.height);
}
}

@ -0,0 +1,116 @@
class Game {
constructor (w, h) {
this.w = w;
this.h = h;
this.players = {};
this.numPlayers = 0;
this.id = 0;
this.colliders = new Group();
this.spawner = new ZombieSpawner({
game: this,
minX: 0,
maxX: w,
minY: 0,
maxY: 100,
});
this.zombies = [];
this.store = new Store();
this.bank = new Bank();
}
add (id, x, y, w, h) {
this.players[id] = createSprite(x, y, w, h);
this.players[id].id = "p"+this.id;
this.players[id].setCollider("rectangle", 0, 0, w, h);
this.players[id].color = color(255, 255, 255);
this.players[id].shapeColor = color(255, 255, 255);
this.players[id].scale = 1;
this.players[id].mass = 1;
this.colliders.add(this.players[id]);
print(this.players[id].id + " added.");
this.id++;
this.numPlayers++;
}
update() {
this.checkBounds();
this.zombies.forEach(z => z.update());
this.zombies = this.zombies.filter(z => !z.isDead());
}
draw() {
this.update();
this.bank.draw(width*0.25 - 64, height - 128 - 32, 128, 128);
this.store.draw(width*0.75 - 64, height - 128 - 32, 128, 128);
this.zombies.forEach(z => z.draw());
drawSprites();
}
setColor (id, r, g, b) {
this.players[id].color = color(r, g, b);
this.players[id].shapeColor = color(r, g, b);
print(this.players[id].id + " color added.");
}
remove (id) {
this.colliders.remove(this.players[id]);
this.players[id].remove();
delete this.players[id];
this.numPlayers--;
}
checkId (id) {
if (id in this.players) { return true; }
else { return false; }
}
printPlayerIds (x, y) {
push();
noStroke();
fill(Colors.Eggplant);
textSize(16);
text("# players: " + this.numPlayers, x, y);
y = y + 16;
fill(Colors.Eggplant);
for (let id in this.players) {
text(this.players[id].id, x, y);
y += 16;
}
pop();
}
setVelocity(id, velx, vely) {
this.players[id].velocity.x = velx;
this.players[id].velocity.y = vely;
}
checkBounds() {
for (let id in this.players) {
if (this.players[id].position.x < 0) {
this.players[id].position.x = this.w - 1;
}
if (this.players[id].position.x > this.w) {
this.players[id].position.x = 1;
}
if (this.players[id].position.y < 0) {
this.players[id].position.y = this.h - 1;
}
if (this.players[id].position.y > this.h) {
this.players[id].position.y = 1;
}
}
}
addZombie(zombie) {
console.log(["adding zombie", zombie]);
this.zombies.push(zombie);
}
}

@ -15,7 +15,11 @@
<!-- p5.multiplayer--> <!-- p5.multiplayer-->
<script src="lib/p5.multiplayer.js"></script> <script src="lib/p5.multiplayer.js"></script>
<!-- p5 sketch --> <!-- p5 sketch -->
<script src="frame.js"></script> <script src="images.js"></script>
<script src="store.js"></script>
<script src="bank.js"></script>
<script src="zombie.js"></script>
<script src="game.js"></script>
<script src="host.js"></script> <script src="host.js"></script>
<style> body {padding: 0; margin: 0;} </style> <style> body {padding: 0; margin: 0;} </style>
</head> </head>

@ -30,6 +30,7 @@ let game;
function preload() { function preload() {
setupHost(); setupHost();
Images.loadAll();
} }
function setup () { function setup () {
@ -47,7 +48,7 @@ function windowResized() {
} }
function draw () { function draw () {
background(255); background(Colors.Sky);
if(isHostConnected(display=true)) { if(isHostConnected(display=true)) {
// Host/Game draw here. ---> // Host/Game draw here. --->
@ -142,107 +143,3 @@ function processButton (data) {
data.button); data.button);
} }
} }
////////////
// Game
// This simple placeholder game makes use of p5.play
class Game {
constructor (w, h) {
this.w = w;
this.h = h;
this.players = {};
this.numPlayers = 0;
this.id = 0;
this.colliders = new Group();
this.frames = [
new Frame({
x: 100,
y: 100,
width: 200,
height: 200
})
];
}
add (id, x, y, w, h) {
this.players[id] = createSprite(x, y, w, h);
this.players[id].id = "p"+this.id;
this.players[id].setCollider("rectangle", 0, 0, w, h);
this.players[id].color = color(255, 255, 255);
this.players[id].shapeColor = color(255, 255, 255);
this.players[id].scale = 1;
this.players[id].mass = 1;
this.colliders.add(this.players[id]);
print(this.players[id].id + " added.");
this.id++;
this.numPlayers++;
}
draw() {
this.frames.forEach(f => f.draw());
this.checkBounds();
drawSprites();
}
setColor (id, r, g, b) {
this.players[id].color = color(r, g, b);
this.players[id].shapeColor = color(r, g, b);
print(this.players[id].id + " color added.");
}
remove (id) {
this.colliders.remove(this.players[id]);
this.players[id].remove();
delete this.players[id];
this.numPlayers--;
}
checkId (id) {
if (id in this.players) { return true; }
else { return false; }
}
printPlayerIds (x, y) {
push();
noStroke();
fill(Colors.Blackish);
textSize(16);
text("# players: " + this.numPlayers, x, y);
y = y + 16;
fill(Colors.Blackish);
for (let id in this.players) {
text(this.players[id].id, x, y);
y += 16;
}
pop();
}
setVelocity(id, velx, vely) {
this.players[id].velocity.x = velx;
this.players[id].velocity.y = vely;
}
checkBounds() {
for (let id in this.players) {
if (this.players[id].position.x < 0) {
this.players[id].position.x = this.w - 1;
}
if (this.players[id].position.x > this.w) {
this.players[id].position.x = 1;
}
if (this.players[id].position.y < 0) {
this.players[id].position.y = this.h - 1;
}
if (this.players[id].position.y > this.h) {
this.players[id].position.y = 1;
}
}
}
}

@ -0,0 +1,72 @@
const Images = {
loadAll() {
this.zombies = [
loadImage("images/noun_Zombie_1304637.png"),
loadImage("images/noun_Zombie_1304638.png"),
loadImage("images/noun_Zombie_1304639.png"),
loadImage("images/noun_Zombie_1304640.png"),
loadImage("images/noun_Zombie_1304641.png"),
loadImage("images/noun_Zombie_1304645.png"),
loadImage("images/noun_Zombie_1322609.png"),
loadImage("images/noun_Zombie_1322610.png"),
loadImage("images/noun_Zombie_1322611.png"),
loadImage("images/noun_Zombie_1322612.png"),
loadImage("images/noun_Zombie_1322613.png"),
loadImage("images/noun_Zombie_1322614.png"),
loadImage("images/noun_Zombie_1322615.png"),
loadImage("images/noun_Zombie_1322616.png"),
loadImage("images/noun_Zombie_1322617.png"),
loadImage("images/noun_Zombie_1322618.png"),
loadImage("images/noun_Zombie_1322619.png"),
loadImage("images/noun_Zombie_1322620.png"),
loadImage("images/noun_Zombie_1322621.png"),
loadImage("images/noun_Zombie_1322622.png"),
loadImage("images/noun_Zombie_1322623.png"),
loadImage("images/noun_Zombie_1322624.png"),
loadImage("images/noun_Zombie_1322625.png"),
loadImage("images/noun_Zombie_1322626.png"),
loadImage("images/noun_Zombie_1322627.png"),
loadImage("images/noun_Zombie_1322628.png"),
loadImage("images/noun_Zombie_1322629.png"),
loadImage("images/noun_Zombie_1322630.png"),
loadImage("images/noun_Zombie_1322631.png"),
loadImage("images/noun_Zombie_1322632.png"),
loadImage("images/noun_Zombie_1322633.png"),
loadImage("images/noun_Zombie_1322634.png"),
loadImage("images/noun_Zombie_1322635.png"),
loadImage("images/noun_Zombie_1322636.png"),
loadImage("images/noun_Zombie_1322637.png"),
loadImage("images/noun_Zombie_1322638.png"),
loadImage("images/noun_Zombie_1322639.png"),
loadImage("images/noun_Zombie_1322640.png"),
loadImage("images/noun_Zombie_1322641.png"),
loadImage("images/noun_Zombie_1322642.png"),
loadImage("images/noun_Zombie_1322643.png"),
loadImage("images/noun_Zombie_1322644.png")
];
this.playerAvatars = [
loadImage("images/noun_Baby_851140.png"),
loadImage("images/noun_Bear_812815.png"),
loadImage("images/noun_cool_925419.png"),
loadImage("images/noun_cool_925435.png"),
loadImage("images/noun_evil_925412.png"),
loadImage("images/noun_evil_925432.png"),
loadImage("images/noun_girl_922146.png"),
loadImage("images/noun_Happy_925423.png"),
loadImage("images/noun_joy_925443.png"),
loadImage("images/noun_joyful_925420.png"),
loadImage("images/noun_joyful_925439.png"),
loadImage("images/noun_Lady_922143.png"),
loadImage("images/noun_Man_922145.png"),
loadImage("images/noun_Man_922164.png"),
loadImage("images/noun_monkey_face.png"),
loadImage("images/noun_Robot_835621.png"),
loadImage("images/noun_teddy_bear.png")
];
this.bank = loadImage("images/noun_Bank_873947.png");
this.burger = loadImage("images/noun_cheeseburger_940494.png");
this.crown = loadImage("images/noun_Crown_801129.png");
this.cash = loadImage("images/noun_money_bag.png");
this.restaurant = loadImage("images/noun_restaurant.png");
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 KiB

@ -1,9 +1,9 @@
const Colors = { const Colors = {
Tan: "#D8BDB3", Eggplant: "#26011C",
DarkTan: "#A58072", Purple: "#59024B",
Blackish: "#262523", Sky: "#05F2DB",
Blood: "#8C021C", DarkGreen: "#038C33",
Rust: "#590910", LightGreen: "#84D930",
}; };
//////////// ////////////
@ -91,10 +91,10 @@ function onHostConnect (data) {
// Displays server address in lower left of screen // Displays server address in lower left of screen
function displayAddress() { function displayAddress() {
push(); push();
fill(Colors.Blackish); fill(Colors.Eggplant);
noStroke(); noStroke();
textSize(50); textSize(50);
text(serverIp+"/?="+roomId, 10, height-50); text(serverIp+"/?="+roomId, 10, 50);
pop(); pop();
} }

@ -0,0 +1,15 @@
class Store {
constructor() {
}
draw(x, y, w, h) {
tint(Colors.Purple);
let purple = color(Colors.Purple);
noFill();
stroke(purple);
strokeWeight(2);
rect(x, y, w, h);
image(Images.restaurant, x, y, w, h);
}
}

@ -0,0 +1,51 @@
class Zombie {
constructor(options) {
options = options || {};
this.x = options.x;
this.y = options.y;
this.image = random(Images.zombies);
this.alive = true;
}
update() {
this.y += 1;
}
draw() {
tint(Colors.DarkGreen);
image(this.image, this.x, this.y, 64, 64);
}
isDead() {
return !this.alive || this.y > height;
}
}
class ZombieSpawner {
constructor(options) {
options = options || {};
this.game = options.game;
this.minT = options.minT || 500;
this.maxT = options.maxT || 3000;
this.minX = options.minX || 0;
this.maxX = options.maxX || 500;
this.minY = options.minY || 100;
this.maxY = options.maxY || 100;
this.planNextSpawn();
}
planNextSpawn() {
let t = random(this.minT, this.maxT);
console.log(`will add next zombie in ${t}`);
this.nextSpawn = setTimeout(() => this.spawnZombie(), t);
}
spawnZombie() {
let zombie = new Zombie({
x: random(this.minX, this.maxX),
y: random(this.minY, this.maxY),
});
this.game.addZombie(zombie);
this.planNextSpawn();
}
}
Loading…
Cancel
Save