games/unibutton
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

add emotes and npcs. this really needs a cleanup

Browse source
This commit is contained in:
biglyderv 2024-11-25 14:14:20 -05:00
parent da4b0f5df8
commit f8b014507f
11 changed files with 267 additions and 85 deletions
Download patch file Download diff file Expand all files Collapse all files

95
static/js/index.js
View file

@ -1,13 +1,26 @@
import Player from "./player.js";
import GameBasic from "./game_basic.js";
import NPC from "./npc.js";
const cs = 1024;
const assets = [
'assets/player.svg',
'assets/head.svg',
'assets/map.svg'
'assets/map.svg',
'assets/npc.svg'
];
const origin = 'https://ub.zenoverse.net/'
const legalTypes = {
Player,
NPC
}
const options = [
'Troll',
'Exit',
'Elec Piano Loop',
'No',
'Yes'
]
const origin = (window.location.href.indexOf('localhost') != -1) ? window.location.href : 'https://ub.zenoverse.net/'
class Game extends GameBasic {
constructor() {
@ -42,20 +55,33 @@ class Game extends GameBasic {
for (let ent of entities) {
if (ent.health <= 0) continue;
ctx.save();
if (ent.type == 'Player') {
ctx.save();
ctx.translate(ent.pos.x, ent.pos.y);
ctx.rotate(ent.rot);
ctx.drawImage(assetsIn[1], -64 / 2, -128, 64, 128);
ctx.translate(ent.pos.x, ent.pos.y);
ctx.rotate(ent.rot);
ctx.drawImage(assetsIn[1], -64 / 2, -128, 64, 128);
ctx.restore();
ctx.restore();
ctx.fillStyle = ent.you.split('-')[0];
ctx.beginPath();
ctx.arc(ent.pos.x, ent.pos.y, 32,0,2*Math.PI);
ctx.fill();
ctx.drawImage(assetsIn[0], ent.pos.x - 64 / 2, ent.pos.y - 64 / 2, 64, 64);
if (ent.playing) {
ctx.strokeStyle = 'white';
ctx.lineWidth = "20";
ctx.beginPath();
ctx.arc(ent.pos.x, ent.pos.y, 32, 0, 2 * Math.PI);
ctx.stroke();
}
ctx.fillStyle = ent.you.split('-')[0];
ctx.beginPath();
ctx.arc(ent.pos.x, ent.pos.y, 32, 0, 2 * Math.PI);
ctx.fill();
}
ctx.drawImage((ent.type == 'NPC') ? assetsIn[3] : assetsIn[0], ent.pos.x - 64 / 2, ent.pos.y - 64 / 2, 64, 64);
if (ent.type != 'Player') continue;
ctx.strokeStyle = "rgb(255,255,255)";
ctx.lineWidth = "8";
@ -71,14 +97,20 @@ class Game extends GameBasic {
ctx.restore();
if (player.health <= 0) {
if (player.health <= 0 || player.isMenu) {
ctx.fillStyle = 'rgba(0,0,0,0.5)';
ctx.fillRect(0, 0, cs, cs);
ctx.fillStyle = 'rgb(255,255,255)';
ctx.textAlign = "center";
ctx.textBaseline = "middle";
ctx.font = "bold 48px sans-serif";
ctx.fillText('You died! Click to respawn', cs / 2, cs / 2);
if (player.health <= 0) ctx.fillText('You died! Click to respawn', cs / 2, cs / 2);
if (player.isMenu) {
let r = Math.floor(Math.abs(player.rot / 1.2) % options.length);
ctx.fillText(`Click to react ${options[r]}`, cs / 2, cs / 2)
ctx.font = "bold 16px sans-serif";
ctx.fillText(`Wait for options ${options.join(', ')}`, cs / 2, cs / 2 + 50)
}
}
}
click() {
@ -88,6 +120,10 @@ class Game extends GameBasic {
this.ws = new WebSocket(origin);
this.player = new Player(false, true);
this.entities.push(this.player);
} else if (player.isMenu) {
player.r = Math.floor(Math.abs(player.rot / 1.2) % options.length);
player.isMenu = false;
this.sync();
} else {
player.bump();
this.sync();
@ -96,17 +132,34 @@ class Game extends GameBasic {
sync() {
let { player } = this;
let { vel, dir, you, ticks } = player;
let { vel, dir, you, ticks, isMenu, r, playing } = player;
this.ws.send(JSON.stringify({ vel, dir, you, ticks }));
this.ws.send(JSON.stringify({ vel, dir, you, ticks, isMenu, r, playing }));
}
recv({ data }) {
let { player } = this;
let you = player.you;
let that = this;
let entList = JSON.parse(data);
entList = entList.map(x => {
x.handleTick = Player.prototype.handleTick;
let type = (Object.keys(legalTypes).indexOf(x.type) == -1) ? Player : legalTypes[x.type];
x.handleTick = type.prototype.handleTick;
if (x.r != 1) {
let a = new Audio(`assets/${options[x.r]}.wav`);
a.addEventListener('ended', () => {
if (x.you == you) {
that.player.playing = false;
that.sync();
}
a.remove();
})
if (you != x.you) {
x.r = 1;
}
a.play();
}
return x;
})
@ -114,6 +167,12 @@ class Game extends GameBasic {
this.player = Object.assign(this.player || new Player(false, false), matchingPlayer[0]);
if (this.player.r != 1) {
this.player.playing = true;
this.player.r = 1;
that.sync();
}
this.entities = entList;
if (this.entities.length == 0) this.entities = [this.player];