index.html 1.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849
  1. <!DOCTYPE html>
  2. <meta charset="utf-8" />
  3. <html>
  4. <head>
  5. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
  6. <script language="javascript" type="text/javascript">
  7. $(function() {
  8. var connection = null;
  9. $('#join').click(function() {
  10. if (connection != null) {
  11. connection.close();
  12. connection = null;
  13. }
  14. var uri = 'ws://' + window.location.host + '/ws/';
  15. connection = new WebSocket(uri);
  16. var game_id = $('#gameId').val();
  17. var nick = $('#nick').val();
  18. connection.onopen = function() {
  19. var msg = {
  20. join: {
  21. game_id: game_id,
  22. nick: nick,
  23. }
  24. };
  25. connection.send(JSON.stringify(msg));
  26. };
  27. connection.onmessage = function(e) {
  28. alert('Received: ' + e.data);
  29. };
  30. connection.onclose = function() {
  31. //alert("closing");
  32. connection = null;
  33. };
  34. });
  35. });
  36. </script>
  37. </head>
  38. <body>
  39. <form id="loginform">
  40. <label for="gameId">Game ID:</label>
  41. <input id="gameId" type="text" /><br>
  42. <label for="nick">Nickname:</label>
  43. <input id="nick" type="text" /><br>
  44. <input id="join" type="button" value="Join" />
  45. </form>
  46. </body>
  47. </html>