Javascript Rock, Paper, Scissors 3

Implementation of Rock, Paper, Scissors using the Modular and Mediator design patterns.

by Richard Lovell

HTML

<div class="container">
            <div class="header">
                <h3 class="text-muted">Rock Paper Scissors 3</h3>
            </div>
            <div class="jumbotron">
                <div class="row">
        <div class="col-md-6">
            <p>Player 1</p>
            <p><input id="username1-tb" class="form-control" type="text" placeholder="Enter your username"></p>                
                <p><a id="create-btn" class="btn btn-lg btn-success" href="#">Create game</a></p>
                <p>Choose Rock, Paper or Scissors</p>
                <a id="rock-btn1" class="btn btn-lg btn-success" href="#">Rock</a>
                <a id="paper-btn1" class="btn btn-lg btn-success" href="#">Paper</a>
                <a id="scissors-btn1" class="btn btn-lg btn-success" href="#">Scissors</a></div>
        <div class="col-md-6">
            <p>Player 2</p>
            <p><input id="username2-tb" class="form-control" type="text" placeholder="Enter your username"></p>                
                <p><a id="join-btn" class="btn btn-lg btn-success" href="#">Join game</a></p>
                <p>Choose Rock, Paper or Scissors</p>
                <a id="rock-btn2" class="btn btn-lg btn-success" href="#">Rock</a>
                <a id="paper-btn2" class="btn btn-lg btn-success" href="#">Paper</a>
                <a id="scissors-btn2" class="btn btn-lg btn-success" href="#">Scissors</a></div>       
      </div>
</div>
<div class="footer">               
    </div>
</div>

JavaScript

//Creational/Structural pattern
//MODULAR PATTERN

//global module/library 
//import jQuery as a mixin 
//module is bound to document.ready
var rockPaperScissors = library(function ($) {
    return {
        init: function () {
            // module implementation
            // app class
            var APP = function APP() {

                this.bindUI = function () {
                    var gameManager = new APP.GameManager();

                    //player1
                    $("#create-btn").on("click", function () {
                        gameManager.startGame($("#username1-tb").val());
                    });
                    $("#rock-btn1").on("click", function () {
                        gameManager.game.player1.setChoice("rock");
                        gameManager.checkComplete();
                    });
                    $("#paper-btn1").on("click", function () {
                        gameManager.game.player1.setChoice("paper");
                        gameManager.checkComplete();
                    });
                    $("#scissors-btn1").on("click", function () {
                        gameManager.game.player1.setChoice("scissors");
                        gameManager.checkComplete();
                    });

                    //player2
                    $("#join-btn").on("click", function () {
                        gameManager.joinGame($("#username2-tb").val());
                    });
                    $("#rock-btn2").on("click", function () {
                        gameManager.game.player2.setChoice("rock");
                        gameManager.checkComplete();
                    });
                    $("#paper-btn2").on("click", function () {
                        gameManager.game.player2.setChoice("paper");
                        gameManager.checkComplete();
                    });
                    $("#scissors-btn2").on("click", function () {
                       ...