Preload uuids

build/escher.js

@@ -395,34 +395,27 @@
 	};
 
 	/**
-	 * Set vector value from array with a offset.
+	 * Set vector value from array [x, y].
 	 *
-	 * @param {array} array
-	 * @param {number} [offset]
+	 * The vector can be converted to array using the toArray() method.
+	 *
+	 * @param {number[]} array
 	 */
-	Vector2.prototype.fromArray = function(array, offset)
+	Vector2.prototype.fromArray = function(array)
 	{
-		if(offset === undefined) offset = 0;
-
-		this.x = array[offset];
-		this.y = array[offset + 1];
+		this.set(array[0], array[1]);
 	};
 
 	/**
-	 * Convert this vector to an array.
+	 * Convert this vector to an array. Useful for serialization and storage.
+	 *
+	 * Values stored as [x, y].
 	 *
-	 * @param {array} array
-	 * @param {number} [offset]
+	 * @return {number[]} Array containing the values of the vector.
 	 */
-	Vector2.prototype.toArray = function(array, offset)
+	Vector2.prototype.toArray = function()
 	{
-		if(array === undefined) array = [];
-		if(offset === undefined) offset = 0;
-
-		array[offset] = this.x;
-		array[offset + 1] = this.y;
-
-		return array;
+		return [this.x, this.y];
 	};
 
 	/**
@@ -1100,6 +1093,9 @@
 			}
 		});
 
+		// TODO <REMOVE THIS CODE>
+		console.log("getChildByUUID()", uuid, this, object);
+
 		return object;
 	};
 
@@ -1446,34 +1442,40 @@
 	 */
 	Object2D.parse = function(data)
 	{
+		// List of objects created stored as pairs of object, data to be later parsed.
 		var objects = [];
 
-		function createObjectInstances(data) {
+		// Parse all objects from the data object recursively and create the correct instances.
+		function createObjectInstances(data)
+		{
 			if(!Object2D.types.has(data.type))
 			{
 				throw new Error("Object type " + data.type + " unknown. Cannot parse data.");
 			}
 
-			var object = new Object2D.types.get(data.type)();
+			var Constructor = Object2D.types.get(data.type);
+			var object = new Constructor();
+			object.uuid = data.uuid;
+
+			objects.push({object: object, data: data});
+
 			for(var i = 0; i < data.children.length; i++)
 			{
 				object.add(createObjectInstances(data.children[i]));
 			}
 
-			objects.push({object: object, data: data});
-
 			return object;
 		}
 
-		var object = createObjectInstances(data);
+		var root = createObjectInstances(data);
 
 		// Parse objects data
 		for(var i = 0; i < objects.length; i++)
 		{
-			objects[i].object.parse(objects[i].data, object);
+			objects[i].object.parse(objects[i].data, root);
 		}
 
-		return object;
+		return root;
 	};
 
 	/**
@@ -4278,8 +4280,8 @@
 	{
 		var data = Object2D.prototype.serialize.call(this, recursive);
 
-		data.outputSocket = this.outputSocket.uuid;
-		data.inputSocket = this.inputSocket.uuid;
+		data.outputSocket = this.outputSocket !== null ? this.outputSocket.uuid : null;
+		data.inputSocket = this.inputSocket !== null ? this.inputSocket.uuid : null;
 
 		return data;
 	};
@@ -4288,8 +4290,15 @@
 	{
 		Object2D.prototype.parse.call(this, data);
 
-		this.outputSocket = root.getChildByUUID(data.outputSocket);
-		this.inputSocket = root.getChildByUUID(data.inputSocket);
+		if(data.outputSocket !== null)
+		{
+			this.outputSocket = root.getChildByUUID(data.outputSocket);
+		}
+
+		if(data.inputSocket !== null)
+		{
+			this.inputSocket = root.getChildByUUID(data.inputSocket);
+		}
 	};
 
 	/**
@@ -4563,11 +4572,8 @@
 
 	NodeSocket.prototype.onPointerDragStart = function(pointer, viewport)
 	{
-		if(this.connectors.length === 0)
-		{
-			this.creatingConnection = true;
-			this.attachConnector(new NodeConnector());
-		}
+		this.creatingConnection = true;
+		this.attachConnector(new NodeConnector());
 	};
 
 	NodeSocket.prototype.onPointerDrag = function(pointer, viewport, delta, position)

examples/node.html

@@ -176,7 +176,7 @@
 			}
 		}
 
-		// Group to store other objects
+
 		var graph = new Escher.NodeGraph();
 
 		var result = new ResultNode();
@@ -187,7 +187,17 @@
 
 		// Renderer
 		var renderer = new Escher.Renderer(canvas);
-		renderer.createRenderLoop(graph, viewport);
+
+		// Render loop
+		var controls = new Escher.ViewportControls(viewport);
+		function loop()
+		{
+			controls.update(renderer.pointer);
+			renderer.update(graph, viewport);
+			requestAnimationFrame(loop);
+		}
+		loop();
+
 	</script>
 </body>
 </html>

source/Object2D.js

@@ -345,6 +345,9 @@ Object2D.prototype.getChildByUUID = function(uuid)
 		}
 	});
 
+	// TODO <REMOVE THIS CODE>
+	console.log("getChildByUUID()", uuid, this, object);
+
 	return object;
 };
 
@@ -691,34 +694,40 @@ Object2D.prototype.parse = function(data, root)
  */
 Object2D.parse = function(data)
 {
+	// List of objects created stored as pairs of object, data to be later parsed.
 	var objects = [];
 
-	function createObjectInstances(data) {
+	// Parse all objects from the data object recursively and create the correct instances.
+	function createObjectInstances(data)
+	{
 		if(!Object2D.types.has(data.type))
 		{
 			throw new Error("Object type " + data.type + " unknown. Cannot parse data.");
 		}
 
-		var object = new Object2D.types.get(data.type)();
+		var Constructor = Object2D.types.get(data.type);
+		var object = new Constructor();
+		object.uuid = data.uuid;
+
+		objects.push({object: object, data: data});
+
 		for(var i = 0; i < data.children.length; i++)
 		{
 			object.add(createObjectInstances(data.children[i]));
 		}
 
-		objects.push({object: object, data: data});
-
 		return object;
 	}
 
-	var object = createObjectInstances(data);
+	var root = createObjectInstances(data);
 
 	// Parse objects data
 	for(var i = 0; i < objects.length; i++)
 	{
-		objects[i].object.parse(objects[i].data, object);
+		objects[i].object.parse(objects[i].data, root);
 	}
 
-	return object;
+	return root;
 };
 
 export {Object2D};

source/math/Vector2.js

@@ -389,34 +389,27 @@ Vector2.prototype.equals = function(v)
 };
 
 /**
- * Set vector value from array with a offset.
+ * Set vector value from array [x, y].
  *
- * @param {array} array
- * @param {number} [offset]
+ * The vector can be converted to array using the toArray() method.
+ *
+ * @param {number[]} array
  */
-Vector2.prototype.fromArray = function(array, offset)
+Vector2.prototype.fromArray = function(array)
 {
-	if(offset === undefined) offset = 0;
-
-	this.x = array[offset];
-	this.y = array[offset + 1];
+	this.set(array[0], array[1]);
 };
 
 /**
- * Convert this vector to an array.
+ * Convert this vector to an array. Useful for serialization and storage.
+ *
+ * Values stored as [x, y].
  *
- * @param {array} array
- * @param {number} [offset]
+ * @return {number[]} Array containing the values of the vector.
  */
-Vector2.prototype.toArray = function(array, offset)
+Vector2.prototype.toArray = function()
 {
-	if(array === undefined) array = [];
-	if(offset === undefined) offset = 0;
-
-	array[offset] = this.x;
-	array[offset + 1] = this.y;
-
-	return array;
+	return [this.x, this.y];
 };
 
 /**

source/objects/BezierCurve.js

@@ -94,9 +94,9 @@ BezierCurve.prototype.serialize = function(recursive)
 	return data;
 };
 
-BezierCurve.prototype.parse = function(data)
+BezierCurve.prototype.parse = function(data, root)
 {
-	Line.prototype.parse.call(this, data);
+	Line.prototype.parse.call(this, data, root);
 
 	this.fromCp.fromArray(data.fromCp);
 	this.toCp.fromArray(data.toCp);

source/objects/Box.js

@@ -90,9 +90,9 @@ Box.prototype.serialize = function(recursive)
 	return data;
 };
 
-Box.prototype.parse = function(data)
+Box.prototype.parse = function(data, root)
 {
-	Object2D.prototype.parse.call(this, data);
+	Object2D.prototype.parse.call(this, data, root);
 
 	this.box.fromArray(data.box);
 	this.strokeStyle = data.strokeStyle;

source/objects/Circle.js

@@ -88,9 +88,9 @@ Circle.prototype.serialize = function(recursive)
 	return data;
 };
 
-Circle.prototype.parse = function(data)
+Circle.prototype.parse = function(data, root)
 {
-	Object2D.prototype.parse.call(this, data);
+	Object2D.prototype.parse.call(this, data, root);
 
 	this.radius = data.radius;
 	this.strokeStyle = data.strokeStyle;

source/objects/DOM.js

@@ -113,9 +113,9 @@ DOM.prototype.serialize = function(recursive)
 	return data;
 };
 
-DOM.prototype.parse = function(data)
+DOM.prototype.parse = function(data, root)
 {
-	Object2D.prototype.parse.call(this, data);
+	Object2D.prototype.parse.call(this, data, root);
 
 	this.size.fromArray(data.size);
 

source/objects/Graph.js

@@ -113,9 +113,9 @@ Graph.prototype.serialize = function(recursive)
 	return data;
 };
 
-Graph.prototype.parse = function(data)
+Graph.prototype.parse = function(data, root)
 {
-	Object2D.prototype.parse.call(this, data);
+	Object2D.prototype.parse.call(this, data, root);
 
 	this.box.fromArray(data.box);
 	this.strokeStyle = data.strokeStyle;

source/objects/Image.js

@@ -75,9 +75,9 @@ Image.prototype.serialize = function(recursive)
 	return data;
 };
 
-Image.prototype.parse = function(data)
+Image.prototype.parse = function(data, root)
 {
-	Object2D.prototype.parse.call(this, data);
+	Object2D.prototype.parse.call(this, data, root);
 
 	this.box.fromArray(data.box);
 	this.image.src = data.image;

source/objects/Line.js

@@ -90,9 +90,9 @@ Line.prototype.serialize = function(recursive)
 	return data;
 };
 
-Line.prototype.parse = function(data)
+Line.prototype.parse = function(data, root)
 {
-	Object2D.prototype.parse.call(this, data);
+	Object2D.prototype.parse.call(this, data, root);
 
 	this.to.fromArray(data.to);
 	this.from.fromArray(data.from);

source/objects/MultiLineText.js

@@ -108,9 +108,9 @@ MultiLineText.prototype.serialize = function(recursive)
 	return data;
 };
 
-MultiLineText.prototype.parse = function(data)
+MultiLineText.prototype.parse = function(data, root)
 {
-	Text.prototype.parse.call(this, data);
+	Text.prototype.parse.call(this, data, root);
 
 	this.maxWidth = data.maxWidth;
 	this.lineHeight = data.lineHeight;

source/objects/Pattern.js

@@ -101,9 +101,9 @@ Pattern.prototype.serialize = function(recursive)
 	return data;
 };
 
-Pattern.prototype.parse = function(data)
+Pattern.prototype.parse = function(data, root)
 {
-	Object2D.prototype.parse.call(this, data);
+	Object2D.prototype.parse.call(this, data, root);
 
 	this.box.fromArray(data.box);
 	this.image.src = data.image;

source/objects/QuadraticCurve.js

@@ -78,9 +78,9 @@ QuadraticCurve.prototype.serialize = function(recursive)
 	return data;
 };
 
-QuadraticCurve.prototype.parse = function(data)
+QuadraticCurve.prototype.parse = function(data, root)
 {
-	Line.prototype.parse.call(this, data);
+	Line.prototype.parse.call(this, data, root);
 
 	this.controlPoint.fromArray(data.controlPoint);
 };

source/objects/RoundedBox.js

@@ -79,9 +79,9 @@ RoundedBox.prototype.serialize = function(recursive)
 	return data;
 };
 
-RoundedBox.prototype.parse = function(data)
+RoundedBox.prototype.parse = function(data, root)
 {
-	Box.prototype.parse.call(this, data);
+	Box.prototype.parse.call(this, data, root);
 
 	this.radius = data.radius;
 };

source/objects/Text.js

@@ -105,9 +105,9 @@ Text.prototype.serialize = function(recursive)
 	return data;
 };
 
-Text.prototype.parse = function(data)
+Text.prototype.parse = function(data, root)
 {
-	Object2D.prototype.parse.call(this, data);
+	Object2D.prototype.parse.call(this, data, root);
 
 	this.text = data.text;
 	this.font = data.font;

source/objects/node/Node.js

@@ -172,7 +172,7 @@ Node.prototype.serialize = function(recursive)
 
 Node.prototype.parse = function(data, root)
 {
-	Object2D.prototype.parse.call(this, data);
+	Object2D.prototype.parse.call(this, data, root);
 
 	for(var i = 0; i < data.inputs.length; i++)
 	{

source/objects/node/NodeConnector.js

@@ -92,20 +92,25 @@ NodeConnector.prototype.serialize = function(recursive)
 {
 	var data = Object2D.prototype.serialize.call(this, recursive);
 
-	data.outputSocket = this.outputSocket.uuid;
-	data.inputSocket = this.inputSocket.uuid;
+	data.outputSocket = this.outputSocket !== null ? this.outputSocket.uuid : null;
+	data.inputSocket = this.inputSocket !== null ? this.inputSocket.uuid : null;
 
 	return data;
 };
 
 NodeConnector.prototype.parse = function(data, root)
 {
-	Object2D.prototype.parse.call(this, data);
-
-	this.outputSocket = root.getChildByUUID(data.outputSocket);
-	this.inputSocket = root.getChildByUUID(data.inputSocket);
-};
+	Object2D.prototype.parse.call(this, data, root);
 
+	if(data.outputSocket !== null)
+	{
+		this.outputSocket = root.getChildByUUID(data.outputSocket);
+	}
 
+	if(data.inputSocket !== null)
+	{
+		this.inputSocket = root.getChildByUUID(data.inputSocket);
+	}
+};
 
 export {NodeConnector};

source/objects/node/NodeSocket.js

@@ -275,11 +275,8 @@ NodeSocket.prototype.destroy = function()
 
 NodeSocket.prototype.onPointerDragStart = function(pointer, viewport)
 {
-	if(this.connectors.length === 0)
-	{
-		this.creatingConnection = true;
-		this.attachConnector(new NodeConnector());
-	}
+	this.creatingConnection = true;
+	this.attachConnector(new NodeConnector());
 };
 
 NodeSocket.prototype.onPointerDrag = function(pointer, viewport, delta, position)
@@ -348,7 +345,7 @@ NodeSocket.prototype.serialize = function(recursive)
 
 NodeSocket.prototype.parse = function(data, root)
 {
-	Object2D.prototype.parse.call(this, data);
+	Object2D.prototype.parse.call(this, data, root);
 
 	this.name = data.name;
 	this.category = data.category;