Draw the game board

This commit is contained in:
2020-04-10 19:08:25 +02:00
parent decc2a88d7
commit 39e625cf3d
3 changed files with 104 additions and 35 deletions

View File

@@ -1,15 +1,29 @@
import dom, jsconsole, sugar, times, strformat
import dom, sugar, times, strformat
import src/game
const
canvasId = "game_canvas"
debug = false ## Debug flag. Set to true to show additional debug info
canvasId = "game_canvas" ## ID of the game canvas element
var frameCount = 0
var mtttGame: Game
var startTime, now, then: Time
var elapsed, fpsInterval: Duration
proc showDebugInfo(): void =
## Update the debug info bar at the top of the window
var sinceStart = now - startTime;
frameCount.inc
var currentFps = (1000 / (sinceStart.inMilliseconds.int / frameCount) * 100) / 100;
var e: Element
e = dom.document.getElementById("fps")
e.innerHTML = fmt"Current FPS: {currentFps:9.2f}"
e = dom.document.getElementById("fps-interval")
e.innerHTML = fmt"FPS Interval: {fpsInterval}"
e = dom.document.getElementById("then")
e.innerHTML = fmt"Seconds since start: {sinceStart.inSeconds}"
proc animate(): void =
# request another frame
discard window.requestAnimationFrame((time: float) => animate())
@@ -22,28 +36,23 @@ proc animate(): void =
# Get ready for next frame by setting then=now, but also adjust for your
# specified fpsInterval not being a multiple of RAF's interval (16.7ms)
then = now - fpsInterval
var sinceStart = now - startTime;
frameCount.inc
var currentFps = (1000 / (sinceStart.inMilliseconds.int / frameCount) * 100) / 100;
var e: Element
e = dom.document.getElementById("fps")
e.innerHTML = fmt"Current FPS: {currentFps:9.2f}"
e = dom.document.getElementById("fps-interval")
e.innerHTML = fmt"FPS Interval: {fpsInterval}"
e = dom.document.getElementById("then")
e.innerHTML = fmt"Seconds since start: {sinceStart.inSeconds}"
if (debug):
showDebugInfo()
mtttGame.nextFrame(elapsed)
proc startAnimating(fps: int): void =
# Make sure we run a 60 FPS
fpsInterval = initDuration(milliseconds = (1000 / fps).toInt)
then = getTime()
startTime = then
animate()
proc onLoad(event: Event) {.exportc.} =
mtttGame = newGame(canvasId, window.innerWidth, window.innerHeight)
if(not debug):
dom.document.getElementById("debug").style.display = "none";
mtttGame = newGame(canvasId, debug)
startAnimating(60)
window.onload = onLoad