nicolas
/
acorn


			
				
					
						
						
							12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091
							<!DOCTYPE html>
<meta charset="utf-8" />
<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script language="javascript" type="text/javascript">
        $(function() {
            var connection = null;

            $('#join').click(function() {
                var game_id = $('#gameId').val();
                var nick = $('#nick').val();
                var msg = {
                    join: {
                        game_id: game_id,
                        nick: nick,
                    }
                };
                connect(msg);
            });

            $('#create').click(function() {
                var game_id = $('#gameId').val();
                var nick = $('#nick').val();
                var msg = {
                    create_game: {
                        game_id: game_id,
                        nick: nick,
                    }
                };
                connect(msg);
            });

            function connect(initial_message) {
                if (connection != null) {
                    disconnect();
                }
                var uri = 'ws://' + window.location.host + '/ws/';
                connection = new WebSocket(uri);

                connection.onopen = function() {
                    connection.send(JSON.stringify(initial_message));
                };
                connection.onmessage = function(e) {
                    onReceive(e);
                };
                connection.onclose = function() {
                    connection = null;
                };
            }
            
            function disconnect() {
                connection.close();
                connection = null;
            }

            function onReceive(msg) {
                var obj = jQuery.parseJSON(msg.data);
                if (obj.game_not_found != null) {
                    $('#status').html("Game \"" + obj.game_not_found.game_id + "\" not found");
                }
                else if (obj.game_already_exists != null) {
                    $('#status').html("Game \"" + obj.game_already_exists.game_id + "\" already exists");
                }
                else if (obj.game_state != null) {
                    playerlist = "";
                    for (var i = 0; i < obj.game_state.players.length; i++) {
                        playerlist = playerlist + ", " + obj.game_state.players[i];
                    }
                    $('#status').html("Players: " + playerlist);
                }
                else {
                    $('#status').html("Unknown Message recieved");
                }
            }
        });
    </script>
</head>
<body>
<form id="loginform">
  <label for="gameId">Game ID:</label>
  <input id="gameId" type="text"  /><br>
  <label for="nick">Nickname:</label>
  <input id="nick" type="text" /><br>
  <input id="join" type="button" value="Join" />
  <input id="create" type="button" value="Create Game" />
</form>
<div id="status">
</div>
</body>
</html>