Object2D.js 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214
  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. * Indicates 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. * Flag to indicate if the object is currently being dragged.
  73. */
  74. this.beingDragged = false;
  75. }
  76. /**
  77. * Traverse the object tree and run a function for all objects.
  78. *
  79. * @param callback Callback function that receives the object as parameter.
  80. */
  81. Object2D.prototype.traverse = function(callback)
  82. {
  83. callback(this);
  84. var children = this.children;
  85. for(var i = 0; i < children.length; i++)
  86. {
  87. children[i].traverse(callback);
  88. }
  89. };
  90. /**
  91. * Attach a children to the object.
  92. *
  93. * @param object Object to attach to this object.
  94. */
  95. Object2D.prototype.add = function(object)
  96. {
  97. object.parent = this;
  98. this.children.push(object);
  99. };
  100. /**
  101. * Remove object from the children list.
  102. *
  103. * @param object Object to be removed.
  104. */
  105. Object2D.prototype.remove = function(object)
  106. {
  107. var index = this.children.indexOf(object);
  108. if(index !== -1)
  109. {
  110. this.children[index].parent = null;
  111. this.children.splice(index, 1)
  112. }
  113. };
  114. /**
  115. * Check if a point is inside of the object.
  116. */
  117. Object2D.prototype.isInside = function(point)
  118. {
  119. return false;
  120. };
  121. /**
  122. * Update the transformation matrix of the object.
  123. */
  124. Object2D.prototype.updateMatrix = function(context)
  125. {
  126. if(this.matrixNeedsUpdate)
  127. {
  128. this.matrix.compose(this.position.x, this.position.y, this.scale.x, this.scale.y, this.rotation);
  129. this.globalMatrix.copy(this.matrix);
  130. if(this.parent !== null)
  131. {
  132. this.globalMatrix.premultiply(this.parent.globalMatrix);
  133. }
  134. this.inverseGlobalMatrix = this.globalMatrix.getInverse()
  135. //this.matrixNeedsUpdate = false;
  136. }
  137. };
  138. /**
  139. * Draw the object into the canvas.
  140. *
  141. * Has to be implemented by underlying classes.
  142. *
  143. * @param context Canvas 2d drawing context.
  144. */
  145. Object2D.prototype.draw = function(context){};
  146. /**
  147. * Callback method called when the pointer enters the object.
  148. *
  149. * Receives (mouse, viewport) as arguments.
  150. */
  151. Object2D.prototype.onPointerEnter = null;
  152. /**
  153. * Callback method called when the was inside of the object and leaves the object.
  154. *
  155. * Receives (mouse, viewport) as arguments.
  156. */
  157. Object2D.prototype.onPointerLeave = null;
  158. /**
  159. * Callback method while the pointer is over (inside) of the object.
  160. *
  161. * Receives (mouse, viewport) as arguments.
  162. */
  163. Object2D.prototype.onPointerOver = null;
  164. /**
  165. * Callback method while the object is being dragged across the screen.
  166. *
  167. * Receives (mouse, viewport, delta) as arguments. Delta is the movement of the mouse already translated into local object coordinates.
  168. */
  169. Object2D.prototype.onPointerDrag = null;
  170. /**
  171. * Callback method called while the pointer button is pressed.
  172. *
  173. * Receives (mouse, viewport) as arguments.
  174. */
  175. Object2D.prototype.onButtonPressed = null;
  176. /**
  177. * Callback method called when the pointer button is pressed down (single time).
  178. */
  179. Object2D.prototype.onButtonDown = null;
  180. /**
  181. * Callback method called when the pointer button is released (single time).
  182. */
  183. Object2D.prototype.onButtonUp = null;