Object2D.js 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210
  1. "use strict";
  2. /**
  3. * Base 2D object class, implements all the object positioning and scalling features.
  4. *
  5. * @class
  6. */
  7. function Object2D()
  8. {
  9. /**
  10. * UUID of the object.
  11. */
  12. this.uuid = UUID.generate();
  13. /**
  14. * List of children objects attached to the object.
  15. */
  16. this.children = [];
  17. /**
  18. * Parent object, the object position is affected by its parent position.
  19. */
  20. this.parent = null;
  21. /**
  22. * Position of the object.
  23. */
  24. this.position = new Vector2(0, 0);
  25. /**
  26. * Scale of the object.
  27. */
  28. this.scale = new Vector2(1, 1);
  29. /**
  30. * Rotation of the object relative to its center.
  31. */
  32. this.rotation = 0.0;
  33. /**
  34. * Layer of this object, objects are sorted by layer value.
  35. *
  36. * Lower layer value is draw first.
  37. */
  38. this.layer = 0;
  39. /**
  40. * Local transformation matrix applied to the object.
  41. */
  42. this.matrix = new Matrix();
  43. /**
  44. * Global transformation matrix multiplied by the parent matrix.
  45. *
  46. * Used to transform the object before projecting into screen coordinates.
  47. */
  48. this.globalMatrix = new Matrix();
  49. /**
  50. * Inverse of the global matrix.
  51. *
  52. * Used to convert mouse input points into object coordinates.
  53. */
  54. this.inverseGlobalMatrix = new Matrix();
  55. /**
  56. * If true the matrix is updated before rendering the object.
  57. */
  58. this.matrixNeedsUpdate = true;
  59. /**
  60. * Flag to indicate if its possible to drag the object around.
  61. *
  62. * If true the onPointerDrag callback is used to update the state of the object.
  63. */
  64. this.draggable = true;
  65. /**
  66. * Flag indicating if the pointer is inside of the element.
  67. *
  68. * Used to control object event.
  69. */
  70. this.pointerInside = false;
  71. }
  72. /**
  73. * Traverse the object tree and run a function for all objects.
  74. *
  75. * @param callback Callback function that receives the object as parameter.
  76. */
  77. Object2D.prototype.traverse = function(callback)
  78. {
  79. callback(this);
  80. var children = this.children;
  81. for(var i = 0; i < children.length; i++)
  82. {
  83. children[i].traverse(callback);
  84. }
  85. };
  86. /**
  87. * Attach a children to the object.
  88. *
  89. * @param object Object to attach to this object.
  90. */
  91. Object2D.prototype.add = function(object)
  92. {
  93. object.parent = this;
  94. this.children.push(object);
  95. };
  96. /**
  97. * Remove object from the children list.
  98. *
  99. * @param object Object to be removed.
  100. */
  101. Object2D.prototype.remove = function(object)
  102. {
  103. var index = this.children.indexOf(object);
  104. if(index !== -1)
  105. {
  106. this.children[index].parent = null;
  107. this.children.splice(index, 1)
  108. }
  109. };
  110. /**
  111. * Check if a point is inside of the object.
  112. */
  113. Object2D.prototype.isInside = function(point)
  114. {
  115. return false;
  116. };
  117. /**
  118. * Update the transformation matrix of the object.
  119. */
  120. Object2D.prototype.updateMatrix = function(context)
  121. {
  122. if(this.matrixNeedsUpdate)
  123. {
  124. this.matrix.compose(this.position.x, this.position.y, this.scale.x, this.scale.y, this.rotation);
  125. this.globalMatrix.copy(this.matrix);
  126. if(this.parent !== null)
  127. {
  128. this.globalMatrix.premultiply(this.parent.globalMatrix);
  129. }
  130. this.inverseGlobalMatrix = this.globalMatrix.getInverse()
  131. //this.matrixNeedsUpdate = false;
  132. }
  133. };
  134. /**
  135. * Draw the object into the canvas.
  136. *
  137. * Has to be implemented by underlying classes.
  138. *
  139. * @param context Canvas 2d drawing context.
  140. */
  141. Object2D.prototype.draw = function(context){};
  142. /**
  143. * Callback method called when the pointer enters the object.
  144. *
  145. * Receives (mouse, viewport) as arguments.
  146. */
  147. Object2D.prototype.onPointerEnter = null;
  148. /**
  149. * Callback method called when the was inside of the object and leaves the object.
  150. *
  151. * Receives (mouse, viewport) as arguments.
  152. */
  153. Object2D.prototype.onPointerLeave = null;
  154. /**
  155. * Callback method while the pointer is over (inside) of the object.
  156. *
  157. * Receives (mouse, viewport) as arguments.
  158. */
  159. Object2D.prototype.onPointerOver = null;
  160. /**
  161. * Callback method while the object is being dragged across the screen.
  162. *
  163. * Receives (mouse, viewport, delta) as arguments. Delta is the movement of the mouse already translated into local object coordinates.
  164. */
  165. Object2D.prototype.onPointerDrag = null;
  166. /**
  167. * Callback method called while the p
  168. ointer button is pressed.
  169. *
  170. * Receives (mouse, viewport) as arguments.
  171. */
  172. Object2D.prototype.onButtonPressed = null;
  173. /**
  174. * Callback method called when the pointer button is pressed down (single time).
  175. */
  176. Object2D.prototype.onButtonDown = null;
  177. /**
  178. * Callback method called when the pointer button is released (single time).
  179. */
  180. Object2D.prototype.onButtonUp = null;