The score

Añade dos nuevas variables justo después de la definición de las anteriores:

// ...
var scoreText;
var score = 0;

Ahora añade esta línea al final de la función create():

scoreText = game.add.text(5, 5, "Points: 0", {
  font: "18px Arial",
  fill: "#0095DD",
});

El método text() puede tomar cuatro parámetros:

• Las coordenadas x e y dónde escribir el texto.
• El texto que se mostrará.
• El estilo de la fuente con la que se representará el texto.

El último parámetro se parece mucho a los estilos de CSS. En nuestro caso, el texto de la puntuación será azul, con un tamaño de 18 pixeles y usará como estilo de fuente Arial.

Incrementaremos el número de puntos cada vez que la pelota golpee en un ladrillo y actualizaremos el scoreText para mostrar la puntuación actual. Esto, lo podremos hacer usando el método setText() — añade las dos siguientes líneas a la función ballHitBrick():

function ballHitBrick(ball, brick) {
  brick.kill();
  score += 10;
  scoreText.setText("Points: " + score);
}

Eso es todo por ahora — recarga tu index.html y comprueba que la puntuación se actualiza por cada golpe al ladrillo.

Puede comprobar el código terminado de esta lección en la demo que aparece a continuación, y jugar para entender mejor cómo funciona el juego:

Ya tenemos un sistema de puntuación, pero para qué sirve jugar y mantener la puntuación si no se puede ganar. Veremos cómo podemos añadir la victoria, permitiendonos así ganar el juego.

io error: No such file or directory (os error 2) (/home/runner/work/yari/yari/mdn/content/files/en-us/games/workflows/2d_breakout_game_phaser/collision_detection/index.md)