With the idea of keeping the end in mind as we get started, Figure 1 shows a picture of our final client-side application. The interaction is, hopefully, intuitive: the player can move their paddle up or down by clicking and dragging the mouse and the ball bounces off the paddles and off the top and bottom walls. If the ball passes a player's paddle, the other player wins a point:

Figure 1. Basic XMPP Pong screenshot

As a player moves their paddle, XMPP messages will be sent to the other player and the graphics will be updated in the other player's game. Each player’s client code will maintain the ball state, which is clearly not an ideal way to run a game.

Since a player can move their own paddle by moving the mouse, and the opposing player’s paddle would be moved by an incoming XMPP message to the first player’s client, there are two ways for the paddles to be updated on the screen, so we’ll need to keep that in mind as we develop this client. In our game, the...