NodeSocket.js 6.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251
  1. import {Circle} from "../Circle";
  2. import {Node} from "./Node";
  3. import {NodeConnector} from "./NodeConnector";
  4. import {Text} from "../Text";
  5. /**
  6. * Represents a node hook point. Is attached to the node element and represented visually.
  7. *
  8. * Can be used as a node input, output or as a bidirectional connection.
  9. *
  10. * @class NodeSocket
  11. * @param {Node} node Node of this hook.
  12. * @param {number} direction Direction of the hook.
  13. * @param {string} type Data type of the node socket.
  14. * @param {string} name Name of the node socket.
  15. */
  16. function NodeSocket(node, direction, type, name)
  17. {
  18. Circle.call(this);
  19. this.draggable = true;
  20. this.radius = 6;
  21. this.layer = 1;
  22. /**
  23. * Name of the socket presented to the user.
  24. *
  25. * @type {string}
  26. */
  27. this.name = name !== undefined ? name : "";
  28. /**
  29. * Type of data available from this socket. Only sockets of the same type can be connected.
  30. *
  31. * Should directly store the data type name (e.g. "string", "number", "Object", etc).
  32. *
  33. * @type {string}
  34. */
  35. this.type = type !== undefined ? type : "";
  36. /**
  37. * Direction of the node hook, indicates the data flow of the socket.
  38. *
  39. * Can be INPUT or OUTPUT.
  40. *
  41. * @type {number}
  42. */
  43. this.direction = direction;
  44. /**
  45. * Node where this socket is attached to.
  46. *
  47. * Should be used to get data from node GUI and from other sockets.
  48. *
  49. * @type {Node}
  50. */
  51. this.node = node;
  52. /**
  53. * Node connector used to connect this socket to another node socket.
  54. *
  55. * Can be used to access the adjacent node.
  56. *
  57. * @type {NodeConnector}
  58. */
  59. this.connector = null;
  60. /**
  61. * Text object used to present the name of the socket.
  62. *
  63. * Depending on the socket direction the text is aligned to the left or to the right.
  64. *
  65. * @type {Text}
  66. */
  67. this.text = new Text();
  68. this.text.text = this.name;
  69. if(this.direction === NodeSocket.INPUT)
  70. {
  71. this.text.position.x -= 10;
  72. this.text.textAlign = "right";
  73. }
  74. else if(this.direction === NodeSocket.OUTPUT)
  75. {
  76. this.text.position.x += 10;
  77. this.text.textAlign = "left";
  78. }
  79. this.add(this.text);
  80. }
  81. /**
  82. * Input hook can only be connected to an output.
  83. *
  84. * Is used to read data from the output.
  85. *
  86. * @type {number}
  87. */
  88. NodeSocket.INPUT = 1;
  89. /**
  90. * Output hook can only be connected to an input.
  91. *
  92. * Writes data to the output.
  93. *
  94. * @type {number}
  95. */
  96. NodeSocket.OUTPUT = 2;
  97. NodeSocket.prototype = Object.create(Circle.prototype);
  98. /**
  99. * Get value stored or calculated in node socket. For output values it should be the calculated value from node logic, node inputs etc.
  100. *
  101. * For input nodes the value should be fetched trough the connector object that is connected to an output node elsewhere.
  102. *
  103. * By default it the socket is an INPUT it gets the value trough the connector if available, if the socket is an OUTPUT or there is no connection the method returns null.
  104. *
  105. * The method should be extended by implementations of this class to process data. The node object can be access to get information from other sockets.
  106. *
  107. * @return {Object} Return data calculated from the node.
  108. */
  109. NodeSocket.prototype.getValue = function()
  110. {
  111. if(this.direction === NodeSocket.INPUT && this.connector !== null && this.connector.outputSocket !== null)
  112. {
  113. return this.connector.outputSocket.getValue();
  114. }
  115. return null;
  116. };
  117. /**
  118. * Connect this node socket to another socket.
  119. *
  120. * Sockets have to be compatible otherwise the connection cannot be made and an error will be thrown.
  121. *
  122. * @param {NodeSocket} socket Socket to be connected with this
  123. * @return {NodeConnector} Node connector created.
  124. */
  125. NodeSocket.prototype.connectTo = function(socket)
  126. {
  127. if(!this.isCompatible(socket))
  128. {
  129. throw new Error("Sockets are not compatible they cannot be connected.");
  130. }
  131. var connector = new NodeConnector();
  132. this.attachConnector(connector);
  133. socket.attachConnector(connector);
  134. return connector;
  135. };
  136. /**
  137. * Attach a node connector to this socket. Sets the correct input/output attributes on the socket and the connector.
  138. *
  139. * Automatically adds the connector to the same parent and the node socket if no parent defined for the connector.
  140. *
  141. * @param {NodeConnector} connector Connector to be attached to this socket.
  142. */
  143. NodeSocket.prototype.attachConnector = function(connector)
  144. {
  145. if(this.direction === NodeSocket.INPUT)
  146. {
  147. connector.inputSocket = this;
  148. }
  149. else if(this.direction === NodeSocket.OUTPUT)
  150. {
  151. connector.outputSocket = this;
  152. }
  153. this.connector = connector;
  154. if(connector.parent === null)
  155. {
  156. this.parent.add(connector);
  157. }
  158. };
  159. /**
  160. * Check if this socket can be connected (is compatible) with another socket.
  161. *
  162. * For two sockets to be compatible the data flow should be correct (one input and a output) and they should carry the same data type.
  163. *
  164. * @param {NodeSocket} socket Socket to verify compatibility with.
  165. * @return {boolean} Returns true if the two sockets are compatible.
  166. */
  167. NodeSocket.prototype.isCompatible = function(socket)
  168. {
  169. return this.direction !== socket.direction && this.type === socket.type;
  170. };
  171. NodeSocket.prototype.destroy = function()
  172. {
  173. Circle.prototype.destroy.call(this);
  174. if(this.connector !== null)
  175. {
  176. this.connector.destroy();
  177. }
  178. };
  179. NodeSocket.prototype.onPointerDragStart = function(pointer, viewport)
  180. {
  181. if(this.connector === null)
  182. {
  183. this.attachConnector(new NodeConnector());
  184. }
  185. };
  186. NodeSocket.prototype.onPointerDrag = function(pointer, viewport, delta, position)
  187. {
  188. if(this.connector !== null)
  189. {
  190. if(this.direction === NodeSocket.INPUT)
  191. {
  192. this.connector.from.copy(position);
  193. }
  194. else if(this.direction === NodeSocket.OUTPUT)
  195. {
  196. this.connector.to.copy(position);
  197. }
  198. }
  199. };
  200. NodeSocket.prototype.onPointerDragEnd = function(pointer, viewport)
  201. {
  202. if(this.connector !== null)
  203. {
  204. var position = viewport.inverseMatrix.transformPoint(pointer.position);
  205. var objects = this.parent.getWorldPointIntersections(position);
  206. var found = false;
  207. for(var i = 0; i < objects.length; i++)
  208. {
  209. if(objects[i] instanceof NodeSocket)
  210. {
  211. if(this.isCompatible(objects[i]))
  212. {
  213. objects[i].attachConnector(this.connector);
  214. found = true;
  215. break;
  216. }
  217. }
  218. }
  219. if(!found)
  220. {
  221. this.connector.destroy();
  222. }
  223. }
  224. };
  225. export {NodeSocket};