Merge branch '2d-tutorial-bounty' into 24-shaders

Author: AristurtleDev

articles/toc.yml

@@ -154,6 +154,10 @@
           href: tutorials/building_2d_games/20_implementing_ui_with_gum/
         - name: "21: Customizing Gum UI"
           href: tutorials/building_2d_games/21_customizing_gum_ui/
+        - name: "22: Snake Game Mechanics"
+          href: tutorials/building_2d_games/22_snake_game_mechanics/
+        - name: "23: Completing the Game"
+          href: tutorials/building_2d_games/23_completing_the_game/
         - name: "24: Shaders"
           href: tutorials/building_2d_games/24_shaders/
 - name: Console Access

articles/tutorials/building_2d_games/10_handling_input/10_handling_input.md

@@ -0,0 +1,40 @@
+// Use a queue directly for input buffering
+private Queue<Vector2> _inputBuffer;
+private const int MAX_BUFFER_SIZE = 2;
+
+// In initialization code:
+_inputBuffer = new Queue<Vector2>(MAX_BUFFER_SIZE);
+
+// In the input handling code:
+KeyboardState keyboard = Keyboard.GetState();
+Vector2 newDirection = Vector2.Zero;
+
+if(keyboard.IsKeyDown(Keys.Up))
+{
+    newDirection = -Vector2.UnitY;
+}
+else if(keyboard.IsKeyDown(Keys.Down))
+{
+    newDirection = Vector2.UnitY;
+}
+else if(keyboard.IsKeyDown(Keys.Left))
+{
+    newDirection = -Vector2.UnitX;
+}
+else if(keyboard.IsKeyDown(Keys.Right))
+{
+    newDirection = Vector2.UnitX;
+}
+
+// Only add if a valid direction and does not exceed the buffer size
+if(newDirection != Vector2.Zero && _inputBuffer.Count < MAX_BUFFER_SIZE)
+{
+    _inputBuffer.Enqueue(newDirection);
+}
+
+// In movement update code
+if(_inputBuffer.COunt > 0)
+{
+    Vector2 nextDirection = _inputBuffer.Dequeue();
+    _position += nextDirection * _speed;
+}

articles/tutorials/building_2d_games/10_handling_input/index.md

@@ -347,7 +347,7 @@ The `Update` method for the `InputManager` calls update for each device so that
 
 ## Implementing the InputManager Class
 
-Now tha we have our input management system complete, we will update our game to use it.  We will do this in two steps:
+Now that we have our input management system complete, we will update our game to use it.  We will do this in two steps:
 
 1. First, update the `Core` class to add the `InputManager` globally.
 2. Update the `Game1` class to use the global input manager from `Core`.
@@ -356,7 +356,7 @@ Now tha we have our input management system complete, we will update our game to
 
 The `Core` class serves as our base game class, so we will update it to add and expose the `InputManager` globally.  Open the *Core.cs* file in the *MonoGameLibrary* project and update it to the following:
 
-[!code-csharp[](./snippets/core.cs?highlight=6,39-47,103-104,112-115)]
+[!code-csharp[](./snippets/core.cs?highlight=5-6,39-47,103-104,107-118)]
 
 The key changes to the `Core` class are:
 
@@ -372,7 +372,7 @@ The key changes to the `Core` class are:
 
 Now we can update our `Game1` class to use the new input management system through the `Core` class.  Open *Game1.cs* in the game project and update it to the following:
 
-[!code-csharp[](./snippets/game1.cs?highlight=76,82,88,94,100,108,113,116,120,126,128-129,134,140,146,152)]
+[!code-csharp[](./snippets/game1.cs?highlight=6,76,82,88,94,100,108,113,116,120,126,128-129,134,140,146,152)]
 
 The key changes to the `Game1` class are:
 

articles/tutorials/building_2d_games/10_handling_input/snippets/inputbuffer.cs

@@ -37,7 +37,7 @@ public class Core : Game
     public static new ContentManager Content { get; private set; }
 
     /// <summary>
-    /// Gets a reference to to the input management system.
+    /// Gets a reference to the input management system.
     /// </summary>
     public static InputManager Input { get; private set; }
 

articles/tutorials/building_2d_games/11_input_management/index.md

@@ -66,9 +66,9 @@ To calculate the squared distance between to points, MonoGame provides the [**Ve
 
 Rectangles, often called *bounding boxes*, typically uses what is called *Axis-Aligned Bounding Box* (AABB) collision detection to determine if two rectangle shapes overlap.  Unlike circles, to perform AABB collision detection, the x- and y-axes of both rectangles must be aligned with the x- and y-axes of the screen.  This is just another way of saying that the rectangles cannot be rotated.
 
-| ![Figure 12-2: The rectangle on the left is axis-aligned since both the axes are aligned with the screen axes. The rectangle on the right is non axis-aligned sine it is rotated and the axes do not align with the screen axe.](./images/aabb-vs-non-aabb.svg) |
+| ![Figure 12-2: The rectangle on the left is axis-aligned since both the axes are aligned with the screen axes. The rectangle on the right is non axis-aligned since it is rotated and the axes do not align with the screen axe.](./images/aabb-vs-non-aabb.svg) |
 | :-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------: |
-|                **Figure 12-2: The rectangle on the left is axis-aligned since both the axes are aligned with the screen axes. The rectangle on the right is non axis-aligned sine it is rotated and the axes do not align with the screen axes**                |
+|                **Figure 12-2: The rectangle on the left is axis-aligned since both the axes are aligned with the screen axes. The rectangle on the right is non axis-aligned since it is rotated and the axes do not align with the screen axes**                |
 
 MonoGame provides the [**Rectangle**](xref:Microsoft.Xna.Framework.Rectangle) struct which represents a rectangle by its position (X,Y) and size (Width,Height). The following table shows some of the properties of the [**Rectangle**](xref:Microsoft.Xna.Framework.Rectangle) struct: