Mostrar arboles creados

src/jugando.ts

@@ -7,6 +7,7 @@ const SEED_COOLDOWN = 300
 const MAP_MIN = 1000
 const MAP_MAX = 5000
 const MAP_SIZE = MAP_MAX - MAP_MIN
+const TREES_TO_WIN = 70
 
 export type State = {
     current: "jugando"
@@ -174,5 +175,15 @@ export function draw(juego: Juego<State>, timestamp: number) {
     drawJugadorx(juego)
     drawSeeds(juego)
 
+    juego.ctx.font = `bold 1rem sans-serif`
     juego.ctx.fillText('Usá las flechitas para moverte, y espacio para "disparar" semillas.', 100, 100)
+
+    const fontSize = '3rem'
+    juego.ctx.font = `bold ${fontSize} sans-serif`
+    const treesText = `Arboles: ${juego.state.trees.length}/${TREES_TO_WIN}`
+    const treesTextMeasure = juego.ctx.measureText(treesText)
+
+    juego.ctx.fillText(treesText,
+        juego.canvas.width - treesTextMeasure.width - 10,
+        10 + treesTextMeasure.actualBoundingBoxAscent)
 }