/* * Paper.js - The Swiss Army Knife of Vector Graphics Scripting. * http://paperjs.org/ * * Copyright (c) 2011 - 2016, Juerg Lehni & Jonathan Puckey * http://scratchdisk.com/ & http://jonathanpuckey.com/ * * Distributed under the MIT license. See LICENSE file for details. * * All rights reserved. */ QUnit.module('SvgImport'); test('Import SVG line', function() { var attrs = { x1: 5, x2: 45, y1: 5, y2: 45 }; var imported = paper.project.importSVG(createSVG('line', attrs)); var path = new Path.Line([attrs.x1, attrs.y1], [attrs.x2, attrs.y2]); equals(imported, path); }); test('Import SVG rect', function() { var attrs = { x: 25, y: 25, width: 100, height: 100 }; var imported = paper.project.importSVG(createSVG('rect', attrs), { expandShapes: true }); var path = new Path.Rectangle(attrs); equals(imported, path); }); test('Import SVG round rect', function() { var attrs = { x: 25, y: 25, rx: 50, ry: 50, width: 100, height: 100 }; var imported = paper.project.importSVG(createSVG('rect', attrs), { expandShapes: true }); var path = new Path.Rectangle(new Rectangle(attrs), new Size(attrs.rx, attrs.ry)); equals(imported, path); }); test('Import SVG ellipse', function() { var attrs = { cx: 300, cy: 80, rx: 100, ry: 50 }; var imported = paper.project.importSVG(createSVG('ellipse', attrs), { expandShapes: true }); var path = new Path.Ellipse({ center: new Point(attrs.cx, attrs.cy), radius: new Point(attrs.rx, attrs.ry) }); equals(imported, path); }); test('Import SVG circle', function() { var attrs = { cx: 100, cy: 80, r: 50 }; var imported = paper.project.importSVG(createSVG('circle', attrs), { expandShapes: true }); var path = new Path.Circle({ center: new Point(attrs.cx, attrs.cy), radius: attrs.r }); equals(imported, path); }); function createPolyPath(str) { var points = str.split(' ').map(function(point) { return point.split(',').map(parseFloat); }); var path = new Path(); path.moveTo(points[0]); for (var i = 1; i < points.length; i++) path.lineTo(points[i]); return path; } test('Import SVG polygon', function() { var points = '100,10 40,180 190,60 10,60 160,180'; var imported = paper.project.importSVG(createSVG('polygon', { points: points })); var path = createPolyPath(points); path.closePath(); equals(imported, path); }); test('Import SVG polyline', function() { var points = '5,5 45,45 5,45 45,5'; var imported = paper.project.importSVG(createSVG('polyline', { points: points })); var path = createPolyPath(points); equals(imported, path); }); test('Import complex CompoundPath and clone', function() { var svg = createSVG(''); var item = paper.project.importSVG(svg); equals(item.clone(), item, null, { cloned: true }); }); if (!isNode) { test('Import SVG clipping', function(assert) { importSVG(assert, 'assets/clipping.svg', 'The imported SVG item should visually be the same as the rasterized original SVG data.'); }); } function importSVG(assert, url, message, options) { var done = assert.async(); project.importSVG(url, { onLoad: function(item, svg) { compareSVG(done, item, svg, message, options); }, onError: function(error) { // TODO: Implement in SvgImport first! pushFailure('Loading SVG from a valid URL should not give an error.'); done(); } }); }