In this chapter we introduce a progress counter in the form of miliseconds that have passed since the start of the game. This progress is used to calculate the rotations and the movement of the enemies and also represents the "score" of the player.
We further extend the controls by a Play/Pause-behavior triggered by the space key. For that we introduce a new type State:
{% codesnippet "https://raw.githubusercontent.com/macrozone/elm-hexagon-tutorial/chapter/game-progress/src/Hexagon.elm", lines="16:17", language="elm" %}{% endcodesnippet %}
We’ll need some of theses states later.
Additionally we’ll introduce a timer that counts the milliseconds that the player has played so far. We add this to the Game-type:
{% codesnippet "https://raw.githubusercontent.com/macrozone/elm-hexagon-tutorial/chapter/game-progress/src/Hexagon.elm", lines="26:36", language="elm" %}{% endcodesnippet %}
Because the player should only be able to move on the Play-State feature, we change the updatePlayer slightly:
{% codesnippet "https://raw.githubusercontent.com/macrozone/elm-hexagon-tutorial/chapter/game-progress/src/Hexagon.elm", lines="76:86", language="elm" %}{% endcodesnippet %}
onUserInput needs also some modifications to fetch the status of the space key and update the game state accordingly:
{% codesnippet "https://raw.githubusercontent.com/macrozone/elm-hexagon-tutorial/chapter/game-progress/src/Hexagon.elm", lines="100:124", language="elm" %}{% endcodesnippet %}
The function onFrame is called on every animation frame event (60 times a second). We add the timing update behaviors there:
{% codesnippet "https://raw.githubusercontent.com/macrozone/elm-hexagon-tutorial/chapter/game-progress/src/Hexagon.elm", lines="126:143", language="elm" %}{% endcodesnippet %}
with some additional functions:
We add the current minus the last stored timestamp to game.msRunning. This is
the time that has passed since the last call to onFrame.
{% codesnippet "https://raw.githubusercontent.com/macrozone/elm-hexagon-tutorial/chapter/game-progress/src/Hexagon.elm", lines="86:98", language="elm" %}{% endcodesnippet %}
We need to update our initialization-function as well to define default-values for our new states:
{% codesnippet "https://raw.githubusercontent.com/macrozone/elm-hexagon-tutorial/chapter/game-progress/src/Hexagon.elm", lines="194:209", language="elm" %}{% endcodesnippet %}
Because we do not see the game progress, we added some Debug functions. You should see the logs in your browser’s console when you run the game.