PageRenderTime 39ms CodeModel.GetById 17ms RepoModel.GetById 0ms app.codeStats 0ms

/js/DemoBox2D/DemoBox2DClientGame.js

http://github.com/onedayitwillmake/RealtimeMultiplayerNodeJs
JavaScript | 144 lines | 72 code | 21 blank | 51 comment | 0 complexity | df1be3c318b642206d29cd888e518b7f MD5 | raw file
Possible License(s): GPL-2.0, LGPL-2.1, MPL-2.0-no-copyleft-exception, BSD-3-Clause
  1. /**
  2. File:
  3. DemoBox2DClientGame.js
  4. Created By:
  5. Mario Gonzalez
  6. Project:
  7. DemoBox2D
  8. Abstract:
  9. This is the client/browser side of the DemoBox2D app within RealtimeMultiplayerNodeJS
  10. Basic Usage:
  11. var clientGame = new DemoBox2D.DemoClientGame();
  12. Version:
  13. 1.0
  14. */
  15. (function () {
  16. DemoBox2D.DemoClientGame = function () {
  17. DemoBox2D.DemoClientGame.superclass.constructor.call(this);
  18. this.startGameClock();
  19. return this;
  20. };
  21. DemoBox2D.DemoClientGame.prototype = {
  22. setupView: function () {
  23. this.view = new DemoBox2D.DemoView(this);
  24. this.view.insertIntoHTMLElementWithId("gamecontainer");
  25. this.view.delegate = this;
  26. DemoBox2D.DemoClientGame.superclass.setupView.call(this);
  27. },
  28. /**
  29. * When the user clicks down, we will create a message and pass that to
  30. * @param aMouseEvent
  31. */
  32. onViewMouseDown: function (aMouseEvent) {
  33. this.netChannel.addMessageToQueue(false, RealtimeMultiplayerGame.Constants.CMDS.PLAYER_UPDATE, { x: aMouseEvent.point.x, y: aMouseEvent.point.y });
  34. },
  35. /**
  36. * @inheritDoc
  37. */
  38. tick: function () {
  39. DemoBox2D.DemoClientGame.superclass.tick.call(this);
  40. this.view.stats.update();
  41. this.view.update(this.gameClockReal);
  42. },
  43. /**
  44. * @inheritDoc
  45. */
  46. createEntityFromDesc: function (entityDesc) {
  47. var diameter = entityDesc.radius * DemoBox2D.Constants.PHYSICS_SCALE;
  48. console.log(entityDesc.entityType, DemoBox2D.Constants.ENTITY_TYPES.BOX);
  49. // Tell CAAT to create a circle or box depending on the info we receive
  50. var entityType = (entityDesc.entityType === DemoBox2D.Constants.ENTITY_TYPES.BOX) ? CAAT.ShapeActor.prototype.SHAPE_RECTANGLE : CAAT.ShapeActor.prototype.SHAPE_CIRCLE;
  51. // Create the entity
  52. var newEntity = new DemoBox2D.Box2DEntity(entityDesc.entityid, entityDesc.clientid);
  53. newEntity.position.set(entityDesc.x, entityDesc.y);
  54. // Create a view via CAAT
  55. var anEntityView = new CAAT.ShapeActor();
  56. anEntityView.create();
  57. anEntityView.setShape(entityType);
  58. anEntityView.setSize(diameter, diameter);
  59. anEntityView.setFillStyle("#" + CAAT.Color.prototype.hsvToRgb((entityDesc.entityid * 15) % 360, 40, 99).toHex()); // Random color
  60. anEntityView.setLocation(entityDesc.x, entityDesc.y); // Place in the center of the screen, use the director's width/height
  61. // Set the view
  62. newEntity.setView(anEntityView);
  63. // Add to the fieldcontroller
  64. this.fieldController.addEntity(newEntity);
  65. },
  66. /**
  67. * Called by the ClientNetChannel, it sends us an array containing tightly packed values and expects us to return a meaningful object
  68. * It is left up to each game to implement this function because only the game knows what it needs to send.
  69. * However the 4 example projects in RealtimeMultiplayerNodeJS offer should be used ans examples
  70. *
  71. * @param {Array} entityDescAsArray An array of tightly packed values
  72. * @return {Object} An object which will be returned to you later on tied to a specific entity
  73. */
  74. parseEntityDescriptionArray: function (entityDescAsArray) {
  75. var entityDescription = {};
  76. // It is left upto each game to implement this function because only the game knows what it needs to send.
  77. // However the 4 example projects in RealtimeMultiplayerNodeJS offer this an example
  78. entityDescription.entityid = +entityDescAsArray[0];
  79. entityDescription.clientid = +entityDescAsArray[1];
  80. entityDescription.entityType = +entityDescAsArray[2];
  81. entityDescription.x = +entityDescAsArray[3];
  82. entityDescription.y = +entityDescAsArray[4];
  83. entityDescription.radius = +entityDescAsArray[5];
  84. entityDescription.rotation = +entityDescAsArray[6];
  85. return entityDescription;
  86. },
  87. /**
  88. * @inheritDoc
  89. */
  90. netChannelDidConnect: function (messageData) {
  91. DemoBox2D.DemoClientGame.superclass.netChannelDidConnect.call(this, messageData);
  92. DemoBox2D.DemoClientGame.prototype.log("DemoClientGame: Joining Game");
  93. this.joinGame("Player" + this.netChannel.getClientid()); // Automatically join the game with some name
  94. },
  95. /**
  96. * @inheritDoc
  97. */
  98. netChannelDidDisconnect: function (messageData) {
  99. DemoBox2D.DemoClientGame.superclass.netChannelDidDisconnect.call(this, messageData);
  100. DemoBox2D.DemoClientGame.prototype.log("DemoClientGame: netChannelDidDisconnect"); // Display disconnect
  101. },
  102. /**
  103. * This function logs something to the right panel
  104. * @param {Object} An object in the form of: { message: ['Client', 'domReady'] }
  105. */
  106. log: (function () {
  107. var message = function (message) {
  108. var el = document.createElement('p');
  109. el.innerHTML = '<b>' + esc(message) + ':</b> ';
  110. // Log if possible
  111. console.log(message);
  112. document.getElementsByTagName('aside')[0].appendChild(el);
  113. document.getElementsByTagName('aside')[0].scrollTop = 1000000;
  114. };
  115. var esc = function (msg) {
  116. return msg.replace(/</g, '&lt;').replace(/>/g, '&gt;');
  117. };
  118. return message;
  119. })()
  120. };
  121. // extend RealtimeMultiplayerGame.AbstractClientGame
  122. RealtimeMultiplayerGame.extend(DemoBox2D.DemoClientGame, RealtimeMultiplayerGame.AbstractClientGame, null);
  123. })();