-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
4441520
commit 554d341
Showing
8 changed files
with
220 additions
and
64 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,70 @@ | ||
import {Tank} from "./tank.mjs" | ||
|
||
const Millisecond = 1 | ||
const Second = 1000 | ||
const FPS = 12 | ||
|
||
export class Player { | ||
constructor(ctx) { | ||
this.ctx = ctx | ||
} | ||
|
||
load(game) { | ||
this.ctx.canvas.width = game.field[0] | ||
this.ctx.canvas.height = game.field[1] | ||
|
||
this.tanks = [] | ||
for (let tankDef of game.tanks) { | ||
let tank = new Tank(this.ctx, tankDef.color, tankDef.sensors) | ||
this.tanks.push(tank) | ||
} | ||
|
||
this.rounds = game.rounds | ||
|
||
this.start() | ||
} | ||
|
||
start(frameno = 0) { | ||
if (!this.loop_id) { | ||
this.loop_id = setInterval( | ||
() => this.update(), | ||
Second / FPS, | ||
) | ||
} | ||
this.frameno = frameno | ||
} | ||
|
||
stop() { | ||
if (this.loop_id) { | ||
clearInterval(this.loop_id) | ||
} | ||
} | ||
|
||
|
||
update() { | ||
let frame = this.rounds[this.frameno] | ||
if (!frame) { | ||
this.stop() | ||
return | ||
} | ||
|
||
this.ctx.clearRect(0, 0, this.ctx.canvas.width, this.ctx.canvas.height) | ||
|
||
// Update and draw craters first | ||
for (let i in frame) { | ||
let tank = this.tanks[i] | ||
tank.set_state(...frame[i]) | ||
tank.draw_crater() | ||
} | ||
// Then sensors | ||
for (let tank of this.tanks) { | ||
tank.draw_wrap_sensors() | ||
} | ||
// Then tanks | ||
for (let tank of this.tanks) { | ||
tank.draw_tank() | ||
} | ||
|
||
this.frameno += 1 | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,30 @@ | ||
<!DOCTYPE html> | ||
<html> | ||
<head> | ||
<title>Tank Round</title> | ||
<link rel="stylesheet" href="style.css"> | ||
<script src="round.mjs" type="module"></script> | ||
</head> | ||
<body> | ||
<h1>Tank Round</h1> | ||
|
||
<div id="game_box"> | ||
<canvas id="battlefield"></canvas> | ||
</div> | ||
|
||
<table id="results"> | ||
<thead> | ||
<tr> | ||
<th></th> | ||
<th>Name</th> | ||
<th>Score</th> | ||
<th>Death</th> | ||
<th>Killer</th> | ||
<th>Error</th> | ||
</tr> | ||
</thead> | ||
<tbody></tbody> | ||
</table> | ||
|
||
</body> | ||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,41 @@ | ||
import {Player} from "./player.mjs" | ||
|
||
function results(round) { | ||
let tbody = document.querySelector("#results tbody") | ||
|
||
for (let tank of round.tanks) { | ||
let tr = tbody.appendChild(document.createElement("tr")) | ||
|
||
let tdSwatch = tr.appendChild(document.createElement("td")) | ||
tdSwatch.class = "swatch" | ||
tdSwatch.style.backgroundColor = tank.color | ||
tdSwatch.textContent = "#" | ||
|
||
let tdName = tr.appendChild(document.createElement("td")) | ||
tdName.textContent = tank.name | ||
|
||
tr.appendChild(document.createElement("td")).textContent = tank.kills | ||
tr.appendChild(document.createElement("td")).textContent = tank.death | ||
tr.appendChild(document.createElement("td")).textContent = round.tanks[tank.killer]?.name | ||
tr.appendChild(document.createElement("td")).textContent = `${tank.error} @${tank.errorPos}` | ||
} | ||
} | ||
|
||
async function init() { | ||
let canvas = document.querySelector("#battlefield") | ||
let ctx = canvas.getContext("2d") | ||
let player = new Player(ctx) | ||
|
||
let indexResp = await fetch("rounds/index.json") | ||
let index = await indexResp.json() | ||
|
||
let recentFn = index[index.length - 1] | ||
console.log(recentFn) | ||
|
||
let roundResp = await fetch(`rounds/${recentFn}`) | ||
let round = await roundResp.json() | ||
player.load(round) | ||
results(round) | ||
} | ||
|
||
init() |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.