Un clone de Pong multijoueur écrit en NodeJS
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

page_base.js~ 2.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114
  1. /**
  2. * @file AppPage.js
  3. * @author frtk@tetalab
  4. */
  5. NPGClient.AppPage = function(n) {
  6. Object.defineProperty(this, 'id', { value: NPGClient.pageCount++ });
  7. this.name = n || '';
  8. // draw loop paramaters
  9. this.loopIntervalId = 0;
  10. this.loopDelay = 40;
  11. // canvas
  12. this.canvas_id = "";
  13. this.canvas_bcol = "";
  14. this.canvas = {};
  15. this.ctx = {};
  16. // ui elements
  17. this.uiElems = [];
  18. };
  19. NPGClient.AppPage.prototype = {
  20. constructor: NPGClient.AppPage,
  21. //
  22. setLoopDelay: function(d) {
  23. this.loopDelay = d;
  24. },
  25. //
  26. startDrawLoop: function() {
  27. var self = this;
  28. self.loopIntervalId = setInterval(function() {
  29. self.run();
  30. }, self.loopDelay);
  31. },
  32. //
  33. stopDrawLoop: function() {
  34. var self = this;
  35. clearInterval(self.loopIntervalId);
  36. self.loopIntervalId = 0;
  37. },
  38. //
  39. run: function() {
  40. var self = this;
  41. self.drawUI();
  42. },
  43. //
  44. configUI: function(id, w, h, c) {
  45. var self = this;
  46. self.canvas_id = id;
  47. self.canvas = document.getElementById(id);
  48. self.ctx = self.canvas.getContext("2d");
  49. self.canvas.width = w;
  50. self.canvas.height = h;
  51. self.canvas_bcol = c;
  52. },
  53. //
  54. addUIObject: function(c) {
  55. var self = this;
  56. self.uiElems.push(c);
  57. },
  58. //
  59. getUIElemByName: function(name) {
  60. var self = this;
  61. if (self.uiElems.length > 0) {
  62. for (var i = 0; i < self.uiElems.length; i++)
  63. if (self.uiElems[i].name == name) return self.uiElems[i];
  64. }
  65. return undefined;
  66. },
  67. //
  68. drawUI: function() {
  69. var self = this;
  70. self.clear();
  71. self.drawUIBackground();
  72. self.drawUIObjects();
  73. },
  74. //
  75. drawUIBackground: function() {
  76. var self = this;
  77. self.ctx.fillStyle = self.canvas_bcol;
  78. self.ctx.fillRect(0, 0, self.canvas.width, self.canvas.height);
  79. },
  80. //
  81. drawUIObjects: function() {
  82. var self = this;
  83. if (self.uiElems.length > 0) {
  84. for (var i = 0; i < self.uiElems.length; i++)
  85. self.uiElems[i].draw(self.ctx);
  86. }
  87. },
  88. //
  89. clear: function() {
  90. var self = this;
  91. self.ctx.clearRect(0, 0, self.canvas.width, self.canvas.height);
  92. },
  93. };