Convert SvgExporter / SvgImporter code to function scopes that only expose functionality through methods on Item and Project.

src/paper.js

@@ -96,8 +96,8 @@ var paper = new function() {
 /*#*/ include('text/PointText.js');
 
 /*#*/ include('svg/SvgStyles.js');
-/*#*/ include('svg/SvgExporter.js');
+/*#*/ include('svg/SvgExport.js');
-/*#*/ include('svg/SvgImporter.js');
+/*#*/ include('svg/SvgImport.js');
 
 /*#*/ include('style/Style.js');
 /*#*/ include('style/PathStyle.js');

src/svg/SvgExport.js

@@ -17,13 +17,10 @@
  */
 
 /**
- * @name SvgExporter
+ * A function scope holding all the functionality needed to convert a
- *
+ * Paper.js DOM to a Paper.js DOM.
- * @class The SvgExporter object holds all the functionality to convert a
- * Paper.js DOM to a SVG DOM.
  */
-
+new function() {
-var SvgExporter = this.SvgExporter = new function() {
 
 	// Shortcut to Base.formatNumber
 	var formatNumber = Base.formatNumber;
@@ -207,7 +204,7 @@ var SvgExporter = this.SvgExporter = new function() {
 		attrs.fill = 'none';
 		var svg = createElement('g', attrs);
 		for (var i = 0, l = children.length; i < l; i++)
-			svg.appendChild(SvgExporter.exportItem(children[i]));
+			svg.appendChild(exportItem(children[i]));
 		return svg;
 	}
 
@@ -365,42 +362,42 @@ var SvgExporter = this.SvgExporter = new function() {
 		return setAttributes(svg, attrs);
 	}
 
-	return /** @Lends SvgExporter */{
+	function exportProject(project) {
-		/**
+		var svg = createElement('svg'),
-		 * Takes the selected Paper.js project and parses all of its layers and
+			layers = project.layers;
-		 * groups to be placed into SVG groups, converting the project into one
+		for (var i = 0, l = layers.length; i < l; i++) {
-		 * SVG group.
+			svg.appendChild(exportItem(layers[i]));
-		 *
-		 * @function
-		 * @param {Project} project a Paper.js project
-		 * @return {SVGSVGElement} the imported project converted to an SVG project
-		 */
-		 // TODO: Implement symbols and Gradients
-		exportProject: function(project) {
-			var svg = createElement('svg'),
-				layers = project.layers;
-			for (var i = 0, l = layers.length; i < l; i++) {
-				svg.appendChild(this.exportItem(layers[i]));
-			}
-			return svg;
-		},
-
-		exportItem: function(item) {
-			var exporter = exporters[item._type];
-			var svg = exporter && exporter(item, item._type);
-			return svg && applyStyle(item, svg);
 		}
-	};
+		return svg;
+	}
+
+	function exportItem(item) {
+		var exporter = exporters[item._type];
+		var svg = exporter && exporter(item, item._type);
+		return svg && applyStyle(item, svg);
+	}
+
+	Item.inject(/** @Lends Item# */{
+		/**
+		 * Exports the item and all its child items as an SVG DOM, all contained
+		 * in one top level SVG group node.
+		 *
+		 * @return {SVGSVGElement} the item converted to an SVG node
+		 */
+		exportSvg: function() {
+			return exportItem(this);
+		}
+	});
+
+	Project.inject(/** @Lends Project# */{
+		/**
+		 * Exports the project and all its layers and child items as an SVG DOM,
+		 * all contained in one top level SVG group node.
+		 *
+		 * @return {SVGSVGElement} the project converted to an SVG node
+		 */
+		exportSvg: function() {
+			return exportProject(this);
+		}
+	});
 };
-
-Item.inject({
-	exportSvg: function() {
-		return SvgExporter.exportItem(this);
-	}
-});
-
-Project.inject({
-	exportSvg: function() {
-		return SvgExporter.exportProject(this);
-	}
-});

src/svg/SvgImport.js

@@ -17,16 +17,10 @@
  */
 
 /**
- * @name SvgImporter
+ * A function scope holding all the functionality needed to convert a SVG DOM
- *
+ * to a Paper.js DOM.
- * @class The SvgImporter object represents an object created using the SVG
- * Canvas that will be converted into a Paper.js object.
- * The SVG object is imported into Paper.js by converting it into items
- * within groups.
- *
  */
-var SvgImporter = this.SvgImporter = new function() {
+new function() {
-
 	// Define a couple of helper functions to easily read values from SVG
 	// objects, dealing with baseVal, and item lists.
 	// index is option, and if passed, causes a lookup in a list.
@@ -54,7 +48,7 @@ var SvgImporter = this.SvgImporter = new function() {
 		for (var i = 0, l = nodes.length; i < l; i++) {
 			var child = nodes[i];
 			if (child.nodeType == 1) {
-				var item = SvgImporter.importSvg(child);
+				var item = importSvg(child);
 				if (item) {
 					var parent = item.getParent();
 					if (parent && !(parent instanceof Layer))
@@ -417,34 +411,40 @@ var SvgImporter = this.SvgImporter = new function() {
 		item.transform(matrix);
 	}
 
-	return /** @Lends SvgImporter */{
+	function importSvg(svg) {
+		var type = svg.nodeName.toLowerCase(),
+			importer = importers[type];
+		var item = importer && importer(svg, type);
+		if (item)
+			applyAttributes(item, svg);
+		return item;
+	}
+
+
+	Item.inject(/** @Lends Item# */{
 		/**
-		 * Creates a Paper.js item using data parsed from the selected
+		 * Converts the passed svg node into a Paper.js item and adds it to the
-		 * SVG DOM node.
+		 * children of this item.
 		 *
 		 * @param {SVGSVGElement} svg the SVG DOM node to convert
 		 * @return {Item} the converted Paper.js item
 		 */
 		importSvg: function(svg) {
-			var type = svg.nodeName.toLowerCase(),
+			return this.addChild(importSvg(svg));
-				importer = importers[type];
-			var item = importer && importer(svg, type);
-			if (item)
-				applyAttributes(item, svg);
-			return item;
 		}
-	};
+	});
+
+	Project.inject(/** @Lends Project# */{
+		/**
+		 * Converts the passed svg node into a Paper.js item and adds it to the
+		 * active layer of this project.
+		 *
+		 * @param {SVGSVGElement} svg the SVG DOM node to convert
+		 * @return {Item} the converted Paper.js item
+		 */
+		importSvg: function(svg) {
+			this.activate();
+			return importSvg(svg);
+		}
+	});
 };
-
-Item.inject({
-	importSvg: function(svg) {
-		return this.addChild(SvgExporter.importSvg(svg));
-	}
-});
-
-Project.inject({
-	importSvg: function(svg) {
-		this.activate();
-		return SvgImporter.importSvg(svg);
-	}
-});

test/tests/SvgExport.js

@@ -1,22 +1,22 @@
 /**
-* Paper.js
+ * Paper.js
-*
+ *
-* This file is part of Paper.js, a JavaScript Vector Graphics Library,
+ * This file is part of Paper.js, a JavaScript Vector Graphics Library,
-* based on Scriptographer.org and designed to be largely API compatible.
+ * based on Scriptographer.org and designed to be largely API compatible.
-* http://paperjs.org/
+ * http://paperjs.org/
-* http://scriptographer.org/
+ * http://scriptographer.org/
-*
+ *
-* Copyright (c) 2011, Juerg Lehni & Jonathan Puckey
+ * Copyright (c) 2011, Juerg Lehni & Jonathan Puckey
-* http://lehni.org/ & http://jonathanpuckey.com/
+ * http://lehni.org/ & http://jonathanpuckey.com/
-*
+ *
-* Distributed under the MIT license. See LICENSE file for details.
+ * Distributed under the MIT license. See LICENSE file for details.
-*
+ *
-* All rights reserved.
+ * All rights reserved.
-*
+ *
-* This test file created by Stetson-Team-Alpha
+ * This test file was created by Stetson-Team-Alpha
-*/
+ */
 
-module('SvgExporter');
+module('SvgExport');
 
 test('compare line path functions', function() {
 	var svgns = 'http://www.w3.org/2000/svg';
@@ -32,7 +32,7 @@ test('compare line path functions', function() {
 
 	var line = new Path.Line([x1, y1], [x2, y2]);
 
-	var exportedLine = SvgExporter.exportItem(line);
+	var exportedLine = line.exportSvg();
 
 	var shapex1 = shape.getAttribute('x1');
 	var shapey1 = shape.getAttribute('y1');
@@ -65,7 +65,7 @@ test('compare negative line path functions', function() {
 
 	var line = new Path.Line([x1, y1], [x2, y2]);
 
-	var exportedLine = SvgExporter.exportItem(line);
+	var exportedLine = line.exportSvg();
 
 	var shapex1 = shape.getAttribute('x1');
 	var shapey1 = shape.getAttribute('y1');
@@ -98,7 +98,7 @@ test('compare invalid line path functions', function() {
 	
 	var line = new Path.Line([x1, y1], [x2, y2]);
 
-	var exportedLine = SvgExporter.exportItem(line);
+	var exportedLine = line.exportSvg();
 
 	var shapex1 = shape.getAttribute('x1');
 	var shapey1 = shape.getAttribute('y1');
@@ -133,7 +133,7 @@ test('compare invalid line path functions', function() {
 	var size = new Size(100, 100);
 	var path = new Path.Rectangle(point, size);
 	
-	var exportedRectangle = SvgExporter.exportItem(path);
+	var exportedRectangle = path.exportSvg();
 
 	var shapex1 = shape.getAttribute('x');
 	var shapey1 = shape.getAttribute('y1');
@@ -168,7 +168,7 @@ test('compare negative rectangle values', function() {
 	var size = new Size(width, height);
 	var rect = new Rectangle(topLeft, size);
 
-	var exportedRectangle = SvgExporter.exportItem(rect);
+	var exportedRectangle = rect.exportSvg();
 
 	var shapex = shape.getAttribute('x');
 	var shapey = shape.getAttribute('y');
@@ -202,7 +202,7 @@ test('compare invalid rectangle values', function() {
 	var size = new Size(width, height);
 	var rect = new Rectangle(topLeft, size);
 
-	var exportedRectangle = SvgExporter.exportItem(rect);
+	var exportedRectangle = rect.exportSvg();
 
 	var shapex = shape.getAttribute('x');
 	var shapey = shape.getAttribute('y');
@@ -242,7 +242,7 @@ test('compare rounded rectangle values', function() {
 	var rect = new Rectangle(topLeft, size);
 	var roundRect = new Path.RoundRectangle(rect, cornerSize);
 
-	var exportedRectangle = SvgExporter.exportItem(rect);
+	var exportedRectangle = rect.exportSvg();
 
 	var shapex = shape.getAttribute('x');
 	var shapey = shape.getAttribute('y');
@@ -286,7 +286,7 @@ test('compare negative rounded rectangle values', function() {
 	var rect = new Rectangle(topLeft, size);
 	var roundRect = new Path.RoundRectangle(rect, cornerSize);
 
-	var exportedRectangle = SvgExporter.exportItem(rect);
+	var exportedRectangle = rect.exportSvg();
 
 	var shapex = shape.getAttribute('x');
 	var shapey = shape.getAttribute('y');
@@ -330,7 +330,7 @@ test('compare invalid rounded rectangle values', function() {
 	var rect = new Rectangle(topLeft, size);
 	var roundRect = new Path.RoundRectangle(rect, cornerSize);
 
-	var exportedRectangle = SvgExporter.exportItem(rect);
+	var exportedRectangle = rect.exportSvg();
 
 	var shapex = shape.getAttribute('x');
 	var shapey = shape.getAttribute('y');
@@ -372,7 +372,7 @@ test('compare ellipse values', function() {
 	var rect = new Rectangle(topLeft, bottomRight);
 	var ellipse = new Path.Ellipse(rect);
 
-	var exportedEllipse = SvgExporter.exportItem(ellipse);
+	var exportedEllipse = ellipse.exportSvg();
 
 	var shapecx = shape.getAttribute('cx');
 	var shapecy = shape.getAttribute('cy');
@@ -404,7 +404,7 @@ test('compare circle values', function() {
 	var center = new Point(cx, cy);
 	var circle = new Path.Circle(center, r);
 
-	var exportedCircle = SvgExporter.exportItem(circle);
+	var exportedCircle = circle.exportSvg();
 
 	var shapecx = shape.getAttribute('cx');
 	var shapecy = shape.getAttribute('cy');
@@ -440,7 +440,7 @@ test('compare polygon values', function() {
 		poly.closePath();
 	}
 
-	var exportedPolygon = SvgExporter.exportItem(poly);
+	var exportedPolygon = poly.exportSvg();
 
 	var svgPoints = shape.getAttribute('points');
 
@@ -470,7 +470,7 @@ test('compare negative polygon values', function() {
 		poly.closePath();
 	}
 
-	var exportedPolygon = SvgExporter.exportItem(poly);
+	var exportedPolygon = poly.exportSvg();
 
 	var svgPoints = shape.getAttribute('points');
 
@@ -500,7 +500,7 @@ test('compare polyline values', function() {
 		poly.closePath();
 	}
 
-	var exportedPolygon = SvgExporter.exportItem(poly);
+	var exportedPolygon = poly.exportSvg();
 
 	var svgPoints = shape.getAttribute('points');
 
@@ -530,7 +530,7 @@ test('compare negative polyline values', function() {
 		poly.closePath();
 	}
 
-	var exportedPolygon = SvgExporter.exportItem(poly);
+	var exportedPolygon = poly.exportSvg();
 
 	var svgPoints = shape.getAttribute('points');
 

test/tests/SvgImport.js

@@ -1,22 +1,22 @@
 /*
-* Paper.js
+ * Paper.js
-*
+ *
-* This file is part of Paper.js, a JavaScript Vector Graphics Library,
+ * This file is part of Paper.js, a JavaScript Vector Graphics Library,
-* based on Scriptographer.org and designed to be largely API compatible.
+ * based on Scriptographer.org and designed to be largely API compatible.
-* http://paperjs.org/
+ * http://paperjs.org/
-* http://scriptographer.org/
+ * http://scriptographer.org/
-*
+ *
-* Copyright (c) 2011, Juerg Lehni & Jonathan Puckey
+ * Copyright (c) 2011, Juerg Lehni & Jonathan Puckey
-* http://lehni.org/ & http://jonathanpuckey.com/
+ * http://lehni.org/ & http://jonathanpuckey.com/
-*
+ *
-* Distributed under the MIT license. See LICENSE file for details.
+ * Distributed under the MIT license. See LICENSE file for details.
-*
+ *
-* All rights reserved.
+ * All rights reserved.
-*
+ *
-* This test file created by Stetson-Team-Alpha
+ * This test file was created by Stetson-Team-Alpha
-*/
+ */
 
-module('SvgImporter');
+module('SvgImport');
 
 test('make an svg line', function() {
 	var svgns = 'http://www.w3.org/2000/svg';

test/tests/load.js

@@ -28,5 +28,5 @@
 
 /*#*/ include('HitResult.js');
 
-/*#*/ include('SvgImporter.js');
+/*#*/ include('SvgImport.js');
-/*#*/ include('SvgExporter.js');
+/*#*/ include('SvgExport.js');