mirror of
https://github.com/scratchfoundation/paper.js.git
synced 2024-12-29 09:22:22 -05:00
Clean up SVGExport tests.
This commit is contained in:
parent
5604dd7a30
commit
3816407ee7
4 changed files with 111 additions and 523 deletions
|
@ -67,6 +67,28 @@ var comparators = {
|
|||
QUnit.push(Base.equals(actual, expected), actual, expected, message);
|
||||
},
|
||||
|
||||
Element: function(actual, expected, message, options) {
|
||||
// Convention: Loop through the attribute lists of both actual and
|
||||
// expected element, and compare values even if they may be inherited.
|
||||
// This is to handle styling values on SVGElements more flexibly.
|
||||
equals(actual && actual.tagName, expected.tagName,
|
||||
(message || '') + '.tagName', options);
|
||||
for (var i = 0; i < expected.attributes.length; i++) {
|
||||
var attr = expected.attributes[i];
|
||||
if (attr.specified) {
|
||||
equals(actual && actual.getAttribute(attr.name), attr.value,
|
||||
(message || '') + '.' + attr.name, options);
|
||||
}
|
||||
}
|
||||
for (var i = 0; i < actual && actual.attributes.length; i++) {
|
||||
var attr = actual.attributes[i];
|
||||
if (attr.specified) {
|
||||
equals(attr.value, expected.getAttribute(attr.name)
|
||||
(message || '') + '.' + attr.name, options);
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
Base: function(actual, expected, message, options) {
|
||||
comparators.Object(actual, expected, message, options);
|
||||
},
|
||||
|
@ -228,14 +250,12 @@ function equals(actual, expected, message, options) {
|
|||
|| type === 'boolean' && 'Boolean'
|
||||
|| type === 'undefined' && 'Undefined'
|
||||
|| Array.isArray(expected) && 'Array'
|
||||
|| (cls = expected && expected._class)
|
||||
|| type === 'object' && 'Object';
|
||||
|| expected instanceof Element && 'Element' // handle DOM Elements
|
||||
|| (cls = expected && expected._class) // check _class 2nd last
|
||||
|| type === 'object' && 'Object'; // Object as catch-all
|
||||
var comparator = type && comparators[type];
|
||||
if (!message) {
|
||||
message = type
|
||||
? type.charAt(0).toLowerCase() + type.substring(1)
|
||||
: 'value';
|
||||
}
|
||||
if (!message)
|
||||
message = type ? type.toLowerCase() : 'value';
|
||||
if (comparator) {
|
||||
comparator(actual, expected, message, options);
|
||||
} else if (expected && expected.equals) {
|
||||
|
|
|
@ -12,527 +12,94 @@
|
|||
|
||||
module('SVGExport');
|
||||
|
||||
// TODO: Implement proper tests and clean up testing code
|
||||
|
||||
test('compare line path functions', function() {
|
||||
var svgns = 'http://www.w3.org/2000/svg';
|
||||
var shape = document.createElementNS(svgns, 'line');
|
||||
var x1 = 5,
|
||||
x2 = 45,
|
||||
y1 = 5,
|
||||
y2 = 45;
|
||||
shape.setAttribute('x1', x1);
|
||||
shape.setAttribute('y1', y1);
|
||||
shape.setAttribute('x2', x2);
|
||||
shape.setAttribute('y2', y2);
|
||||
|
||||
var line = new Path.Line([x1, y1], [x2, y2]);
|
||||
|
||||
var exportedLine = line.exportSVG();
|
||||
|
||||
var shapex1 = shape.getAttribute('x1');
|
||||
var shapey1 = shape.getAttribute('y1');
|
||||
var shapex2 = shape.getAttribute('x2');
|
||||
var shapey2 = shape.getAttribute('y2');
|
||||
|
||||
var exportedx1 = exportedLine.getAttribute('x1');
|
||||
var exportedy1 = exportedLine.getAttribute('y1');
|
||||
var exportedx2 = exportedLine.getAttribute('x2');
|
||||
var exportedy2 = exportedLine.getAttribute('y2');
|
||||
|
||||
equals(shapex1, exportedx1);
|
||||
equals(shapey1, exportedy1);
|
||||
equals(shapex2, exportedx2);
|
||||
equals(shapey2, exportedy2);
|
||||
|
||||
test('Export SVG line', function() {
|
||||
var attrs = {
|
||||
x1: 5,
|
||||
x2: 45,
|
||||
y1: 5,
|
||||
y2: 45
|
||||
};
|
||||
var path = new Path.Line([attrs.x1, attrs.y1], [attrs.x2, attrs.y2]);
|
||||
equals(path.exportSVG(), createSVG('line', attrs));
|
||||
});
|
||||
|
||||
test('compare negative line path functions', function() {
|
||||
var svgns = 'http://www.w3.org/2000/svg';
|
||||
var shape = document.createElementNS(svgns, 'line');
|
||||
var x1 = -5,
|
||||
x2 = -45,
|
||||
y1 = -5,
|
||||
y2 = -45;
|
||||
shape.setAttribute('x1', x1);
|
||||
shape.setAttribute('y1', y1);
|
||||
shape.setAttribute('x2', x2);
|
||||
shape.setAttribute('y2', y2);
|
||||
|
||||
var line = new Path.Line([x1, y1], [x2, y2]);
|
||||
|
||||
var exportedLine = line.exportSVG();
|
||||
|
||||
var shapex1 = shape.getAttribute('x1');
|
||||
var shapey1 = shape.getAttribute('y1');
|
||||
var shapex2 = shape.getAttribute('x2');
|
||||
var shapey2 = shape.getAttribute('y2');
|
||||
|
||||
var exportedx1 = exportedLine.getAttribute('x1');
|
||||
var exportedy1 = exportedLine.getAttribute('y1');
|
||||
var exportedx2 = exportedLine.getAttribute('x2');
|
||||
var exportedy2 = exportedLine.getAttribute('y2');
|
||||
|
||||
equals(shapex1, exportedx1);
|
||||
equals(shapey1, exportedy1);
|
||||
equals(shapex2, exportedx2);
|
||||
equals(shapey2, exportedy2);
|
||||
|
||||
test('Export SVG rect', function() {
|
||||
var attrs = {
|
||||
x: 25,
|
||||
y: 25,
|
||||
width: 100,
|
||||
height: 100
|
||||
};
|
||||
var path = new Path.Rectangle(attrs);
|
||||
equals(path.exportSVG({ matchShapes: true }), createSVG('rect', attrs));
|
||||
});
|
||||
|
||||
test('compare invalid line path functions', function() {
|
||||
var svgns = 'http://www.w3.org/2000/svg';
|
||||
var shape = document.createElementNS(svgns, 'line');
|
||||
var x1 = null,
|
||||
x2 = null,
|
||||
y1 = null,
|
||||
y2 = null;
|
||||
shape.setAttribute('x1', x1);
|
||||
shape.setAttribute('y1', y1);
|
||||
shape.setAttribute('x2', x2);
|
||||
shape.setAttribute('y2', y2);
|
||||
|
||||
var line = new Path.Line([x1, y1], [x2, y2]);
|
||||
|
||||
var exportedLine = line.exportSVG();
|
||||
|
||||
var shapex1 = shape.getAttribute('x1');
|
||||
var shapey1 = shape.getAttribute('y1');
|
||||
var shapex2 = shape.getAttribute('x2');
|
||||
var shapey2 = shape.getAttribute('y2');
|
||||
|
||||
var exportedx1 = exportedLine.getAttribute('x1');
|
||||
var exportedy1 = exportedLine.getAttribute('y1');
|
||||
var exportedx2 = exportedLine.getAttribute('x2');
|
||||
var exportedy2 = exportedLine.getAttribute('y2');
|
||||
|
||||
equals(shapex1, exportedx1);
|
||||
equals(shapey1, exportedy1);
|
||||
equals(shapex2, exportedx2);
|
||||
equals(shapey2, exportedy2);
|
||||
|
||||
test('Export SVG round rect', function() {
|
||||
var attrs = {
|
||||
x: 25,
|
||||
y: 25,
|
||||
rx: 50,
|
||||
ry: 50,
|
||||
width: 100,
|
||||
height: 100
|
||||
};
|
||||
var path = new Path.Rectangle(new Rectangle(attrs),
|
||||
new Size(attrs.rx, attrs.ry));
|
||||
equals(path.exportSVG({ matchShapes: true }), createSVG('rect', attrs));
|
||||
});
|
||||
|
||||
/*
|
||||
test('compare rectangle values', function() {
|
||||
var svgns = 'http://www.w3.org/2000/svg';
|
||||
var shape = document.createElementNS(svgns, 'rect');
|
||||
var x = 25,
|
||||
y = 25,
|
||||
width = 100,
|
||||
height = 100;
|
||||
shape.setAttribute('x', x);
|
||||
shape.setAttribute('y', y);
|
||||
shape.setAttribute('width', width);
|
||||
shape.setAttribute('height', height);
|
||||
|
||||
var point = new Point(100, 100);
|
||||
var size = new Size(100, 100);
|
||||
var path = new Path.Rectangle(point, size);
|
||||
|
||||
var exportedRectangle = path.exportSVG();
|
||||
|
||||
var shapex1 = shape.getAttribute('x');
|
||||
var shapey1 = shape.getAttribute('y1');
|
||||
var shapewidth = shape.getAttribute('width');
|
||||
var shapeheight = shape.getAttribute('height');
|
||||
|
||||
var exportedx = exportedRectangle.getAttribute('x1');
|
||||
var exportedy = exportedRectangle.getAttribute('y1');
|
||||
|
||||
var exportedwidth = exportedRectangle.getAttribute('width');
|
||||
var exportedheight = exportedRectangle.getAttribute('height');
|
||||
|
||||
equals(shapex, exportedx);
|
||||
equals(shapey, exportedy);
|
||||
equals(shapewidth, exportedwidth);
|
||||
equals(shapeheight, exportedheight);
|
||||
});
|
||||
|
||||
test('compare negative rectangle values', function() {
|
||||
var svgns = 'http://www.w3.org/2000/svg';
|
||||
var shape = document.createElementNS(svgns, 'rect');
|
||||
var x = -25,
|
||||
y = -25,
|
||||
width = -100,
|
||||
height = -100;
|
||||
shape.setAttribute('x', x);
|
||||
shape.setAttribute('y', y);
|
||||
shape.setAttribute('width', width);
|
||||
shape.setAttribute('height', height);
|
||||
|
||||
var topLeft = new Point(x, y);
|
||||
var size = new Size(width, height);
|
||||
var rect = new Rectangle(topLeft, size);
|
||||
|
||||
var exportedRectangle = rect.exportSVG();
|
||||
|
||||
var shapex = shape.getAttribute('x');
|
||||
var shapey = shape.getAttribute('y');
|
||||
var shapewidth = shape.getAttribute('width');
|
||||
var shapeheight = shape.getAttribute('height');
|
||||
|
||||
var exportedx = exportedRectangle.getAttribute('x');
|
||||
var exportedy = exportedRectangle.getAttribute('y');
|
||||
var exportedwidth = exportedRectangle.getAttribute('width');
|
||||
var exportedheight = exportedRectangle.getAttribute('height');
|
||||
|
||||
equals(shapex, exportedx);
|
||||
equals(shapey, exportedy);
|
||||
equals(shapewidth, exportedwidth);
|
||||
equals(shapeheight, exportedheight);
|
||||
});
|
||||
|
||||
test('compare invalid rectangle values', function() {
|
||||
var svgns = 'http://www.w3.org/2000/svg';
|
||||
var shape = document.createElementNS(svgns, 'rect');
|
||||
var x = null,
|
||||
y = null,
|
||||
width = null,
|
||||
height = 100;
|
||||
shape.setAttribute('x', x);
|
||||
shape.setAttribute('y', y);
|
||||
shape.setAttribute('width', width);
|
||||
shape.setAttribute('height', height);
|
||||
|
||||
var topLeft = new Point(x, y);
|
||||
var size = new Size(width, height);
|
||||
var rect = new Rectangle(topLeft, size);
|
||||
|
||||
var exportedRectangle = rect.exportSVG();
|
||||
|
||||
var shapex = shape.getAttribute('x');
|
||||
var shapey = shape.getAttribute('y');
|
||||
var shapewidth = shape.getAttribute('width');
|
||||
var shapeheight = shape.getAttribute('height');
|
||||
|
||||
var exportedx = exportedRectangle.getAttribute('x');
|
||||
var exportedy = exportedRectangle.getAttribute('y');
|
||||
var exportedwidth = exportedRectangle.getAttribute('width');
|
||||
var exportedheight = exportedRectangle.getAttribute('height');
|
||||
|
||||
equals(shapex, exportedx);
|
||||
equals(shapey, exportedy);
|
||||
equals(shapewidth, exportedwidth);
|
||||
equals(shapeheight, exportedheight);
|
||||
});
|
||||
|
||||
test('compare rounded rectangle values', function() {
|
||||
var svgns = 'http://www.w3.org/2000/svg';
|
||||
var shape = document.createElementNS(svgns, 'rect');
|
||||
var x = 25,
|
||||
y = 25,
|
||||
rx = 50,
|
||||
ry = 50,
|
||||
width = 100,
|
||||
height = 100;
|
||||
shape.setAttribute('x', x);
|
||||
shape.setAttribute('y', y);
|
||||
shape.setAttribute('rx', rx);
|
||||
shape.setAttribute('ry', ry);
|
||||
shape.setAttribute('width', width);
|
||||
shape.setAttribute('height', height);
|
||||
|
||||
var topLeft = new Point(x, y);
|
||||
var size = new Size(width, height);
|
||||
var cornerSize = new Size(rx, ry);
|
||||
var rect = new Rectangle(topLeft, size);
|
||||
var roundRect = new Path.Rectangle(rect, cornerSize);
|
||||
|
||||
var exportedRectangle = rect.exportSVG();
|
||||
|
||||
var shapex = shape.getAttribute('x');
|
||||
var shapey = shape.getAttribute('y');
|
||||
var shapecx = shape.getAttribute('rx');
|
||||
var shapecy = shape.getAttribute('ry');
|
||||
var shapewidth = shape.getAttribute('width');
|
||||
var shapeheight = shape.getAttribute('height');
|
||||
|
||||
var exportedx = exportedRectangle.getAttribute('x');
|
||||
var exportedy = exportedRectangle.getAttribute('y');
|
||||
var exportedcx = exportedRectangle.getAttribute('rx');
|
||||
var exportedcy = exportedRectangle.getAttribute('ry');
|
||||
var exportedwidth = exportedRectangle.getAttribute('width');
|
||||
var exportedheight = exportedRectangle.getAttribute('height');
|
||||
|
||||
equals(shapex, exportedx);
|
||||
equals(shapey, exportedy);
|
||||
equals(shapewidth, exportedwidth);
|
||||
equals(shapeheight, exportedheight);
|
||||
});
|
||||
|
||||
test('compare negative rounded rectangle values', function() {
|
||||
var svgns = 'http://www.w3.org/2000/svg';
|
||||
var shape = document.createElementNS(svgns, 'rect');
|
||||
var x = -25,
|
||||
y = -25,
|
||||
rx = -50,
|
||||
ry = -50,
|
||||
width = -100,
|
||||
height = -100;
|
||||
shape.setAttribute('x', x);
|
||||
shape.setAttribute('y', y);
|
||||
shape.setAttribute('rx', rx);
|
||||
shape.setAttribute('ry', ry);
|
||||
shape.setAttribute('width', width);
|
||||
shape.setAttribute('height', height);
|
||||
|
||||
var topLeft = new Point(x, y);
|
||||
var size = new Size(width, height);
|
||||
var cornerSize = new Size(rx, ry);
|
||||
var rect = new Rectangle(topLeft, size);
|
||||
var roundRect = new Path.Rectangle(rect, cornerSize);
|
||||
|
||||
var exportedRectangle = rect.exportSVG();
|
||||
|
||||
var shapex = shape.getAttribute('x');
|
||||
var shapey = shape.getAttribute('y');
|
||||
var shapecx = shape.getAttribute('rx');
|
||||
var shapecy = shape.getAttribute('ry');
|
||||
var shapewidth = shape.getAttribute('width');
|
||||
var shapeheight = shape.getAttribute('height');
|
||||
|
||||
var exportedx = exportedRectangle.getAttribute('x');
|
||||
var exportedy = exportedRectangle.getAttribute('y');
|
||||
var exportedcx = exportedRectangle.getAttribute('rx');
|
||||
var exportedcy = exportedRectangle.getAttribute('ry');
|
||||
var exportedwidth = exportedRectangle.getAttribute('width');
|
||||
var exportedheight = exportedRectangle.getAttribute('height');
|
||||
|
||||
equals(shapex, exportedx);
|
||||
equals(shapey, exportedy);
|
||||
equals(shapewidth, exportedwidth);
|
||||
equals(shapeheight, exportedheight);
|
||||
});
|
||||
|
||||
test('compare invalid rounded rectangle values', function() {
|
||||
var svgns = 'http://www.w3.org/2000/svg';
|
||||
var shape = document.createElementNS(svgns, 'rect');
|
||||
var x = null,
|
||||
y = null,
|
||||
rx = null,
|
||||
ry = null,
|
||||
width = null,
|
||||
height = null;
|
||||
shape.setAttribute('x', x);
|
||||
shape.setAttribute('y', y);
|
||||
shape.setAttribute('rx', rx);
|
||||
shape.setAttribute('ry', ry);
|
||||
shape.setAttribute('width', width);
|
||||
shape.setAttribute('height', height);
|
||||
|
||||
var topLeft = new Point(x, y);
|
||||
var size = new Size(width, height);
|
||||
var cornerSize = new Size(rx, ry);
|
||||
var rect = new Rectangle(topLeft, size);
|
||||
var roundRect = new Path.Rectangle(rect, cornerSize);
|
||||
|
||||
var exportedRectangle = rect.exportSVG();
|
||||
|
||||
var shapex = shape.getAttribute('x');
|
||||
var shapey = shape.getAttribute('y');
|
||||
var shapecx = shape.getAttribute('rx');
|
||||
var shapecy = shape.getAttribute('ry');
|
||||
var shapewidth = shape.getAttribute('width');
|
||||
var shapeheight = shape.getAttribute('height');
|
||||
|
||||
var exportedx = exportedRectangle.getAttribute('x');
|
||||
var exportedy = exportedRectangle.getAttribute('y');
|
||||
var exportedcx = exportedRectangle.getAttribute('rx');
|
||||
var exportedcy = exportedRectangle.getAttribute('ry');
|
||||
var exportedwidth = exportedRectangle.getAttribute('width');
|
||||
var exportedheight = exportedRectangle.getAttribute('height');
|
||||
|
||||
equals(shapex, exportedx);
|
||||
equals(shapey, exportedy);
|
||||
equals(shapewidth, exportedwidth);
|
||||
equals(shapeheight, exportedheight);
|
||||
});*/
|
||||
|
||||
test('compare ellipse values', function() {
|
||||
var svgns = 'http://www.w3.org/2000/svg';
|
||||
var shape = document.createElementNS(svgns, 'ellipse');
|
||||
var cx = 100,
|
||||
cy = 80,
|
||||
rx = 50,
|
||||
ry = 30;
|
||||
shape.setAttribute('cx', cx);
|
||||
shape.setAttribute('cy', cy);
|
||||
shape.setAttribute('rx', rx);
|
||||
shape.setAttribute('ry', ry);
|
||||
|
||||
var center = new Point(cx, cy);
|
||||
var offset = new Point(rx, ry);
|
||||
var topLeft = center.subtract(offset);
|
||||
var bottomRight = center.add(offset);
|
||||
|
||||
var rect = new Rectangle(topLeft, bottomRight);
|
||||
var ellipse = new Shape.Ellipse(rect);
|
||||
|
||||
var exportedEllipse = ellipse.exportSVG();
|
||||
|
||||
var shapecx = shape.getAttribute('cx');
|
||||
var shapecy = shape.getAttribute('cy');
|
||||
var shaperx = shape.getAttribute('rx');
|
||||
var shapery = shape.getAttribute('ry');
|
||||
|
||||
var exportedcx = exportedEllipse.getAttribute('cx');
|
||||
var exportedcy = exportedEllipse.getAttribute('cy');
|
||||
var exportedrx = exportedEllipse.getAttribute('rx');
|
||||
var exportedry = exportedEllipse.getAttribute('ry');
|
||||
|
||||
equals(shapecx, exportedcx);
|
||||
equals(shapecy, exportedcy);
|
||||
equals(shaperx, exportedrx);
|
||||
equals(shapery, exportedry);
|
||||
|
||||
});
|
||||
|
||||
test('compare circle values', function() {
|
||||
var svgns = 'http://www.w3.org/2000/svg';
|
||||
var shape = document.createElementNS(svgns, 'circle');
|
||||
var cx = 100,
|
||||
cy = 80,
|
||||
r = 50;
|
||||
shape.setAttribute('cx', cx);
|
||||
shape.setAttribute('cy', cy);
|
||||
shape.setAttribute('r', r);
|
||||
|
||||
var center = new Point(cx, cy);
|
||||
var circle = new Shape.Circle(center, r);
|
||||
|
||||
var exportedCircle = circle.exportSVG();
|
||||
|
||||
var shapecx = shape.getAttribute('cx');
|
||||
var shapecy = shape.getAttribute('cy');
|
||||
var shaper = shape.getAttribute('r');
|
||||
|
||||
var exportedcx = exportedCircle.getAttribute('cx');
|
||||
var exportedcy = exportedCircle.getAttribute('cy');
|
||||
var exportedr = exportedCircle.getAttribute('r');
|
||||
|
||||
equals(shapecx, exportedcx);
|
||||
equals(shapecy, exportedcy);
|
||||
equals(shaper, exportedr);
|
||||
|
||||
});
|
||||
|
||||
test('compare polygon values', function() {
|
||||
var svgns = 'http://www.w3.org/2000/svg';
|
||||
var shape = document.createElementNS(svgns, 'polygon');
|
||||
var svgpoints = "100,10 40,180 190,60 10,60 160,180";
|
||||
shape.setAttribute('points', svgpoints);
|
||||
|
||||
var poly = new Path();
|
||||
var points = shape.points;
|
||||
var start = points.getItem(0);
|
||||
var point;
|
||||
poly.moveTo([start.x, start.y]);
|
||||
|
||||
for (var i = 1; i < points.length; i++) {
|
||||
point = points.getItem(i);
|
||||
poly.lineTo([point.x, point.y]);
|
||||
test('Export SVG ellipse', function() {
|
||||
var attrs = {
|
||||
cx: 300,
|
||||
cy: 80,
|
||||
rx: 100,
|
||||
ry: 50
|
||||
}
|
||||
if (shape.nodeName.toLowerCase() == 'polygon') {
|
||||
poly.closePath();
|
||||
}
|
||||
|
||||
var exportedPolygon = poly.exportSVG();
|
||||
|
||||
var svgPoints = shape.getAttribute('points');
|
||||
|
||||
var exportedPoints = shape.getAttribute('points');
|
||||
|
||||
equals(svgPoints, exportedPoints);
|
||||
|
||||
var path = new Path.Ellipse({
|
||||
center: new Point(attrs.cx, attrs.cy),
|
||||
radius: new Point(attrs.rx, attrs.ry)
|
||||
});
|
||||
equals(path.exportSVG({ matchShapes: true }), createSVG('ellipse', attrs));
|
||||
});
|
||||
|
||||
test('compare negative polygon values', function() {
|
||||
var svgns = 'http://www.w3.org/2000/svg';
|
||||
var shape = document.createElementNS(svgns, 'polygon');
|
||||
var svgpoints = "-100,-10 -40,-180 -190,-60 -10,-60 -160,-180";
|
||||
shape.setAttribute('points', svgpoints);
|
||||
|
||||
var poly = new Path();
|
||||
var points = shape.points;
|
||||
var start = points.getItem(0);
|
||||
var point;
|
||||
poly.moveTo([start.x, start.y]);
|
||||
|
||||
for (var i = 1; i < points.length; i++) {
|
||||
point = points.getItem(i);
|
||||
poly.lineTo([point.x, point.y]);
|
||||
test('Export SVG circle', function() {
|
||||
var attrs = {
|
||||
cx: 100,
|
||||
cy: 80,
|
||||
r: 50
|
||||
}
|
||||
if (shape.nodeName.toLowerCase() == 'polygon') {
|
||||
poly.closePath();
|
||||
}
|
||||
|
||||
var exportedPolygon = poly.exportSVG();
|
||||
|
||||
var svgPoints = shape.getAttribute('points');
|
||||
|
||||
var exportedPoints = shape.getAttribute('points');
|
||||
|
||||
equals(svgPoints, exportedPoints);
|
||||
|
||||
var path = new Path.Circle({
|
||||
center: new Point(attrs.cx, attrs.cy),
|
||||
radius: attrs.r
|
||||
});
|
||||
equals(path.exportSVG({ matchShapes: true }), createSVG('circle', attrs));
|
||||
});
|
||||
|
||||
test('compare polyline values', function() {
|
||||
var svgns = 'http://www.w3.org/2000/svg';
|
||||
var shape = document.createElementNS(svgns, 'polyline');
|
||||
var svgpoints = "5,5 45,45 5,45 45,5";
|
||||
shape.setAttribute('points', svgpoints);
|
||||
|
||||
var poly = new Path();
|
||||
var points = shape.points;
|
||||
var start = points.getItem(0);
|
||||
var point;
|
||||
poly.moveTo([start.x, start.y]);
|
||||
|
||||
for (var i = 1; i < points.length; i++) {
|
||||
point = points.getItem(i);
|
||||
poly.lineTo([point.x, point.y]);
|
||||
}
|
||||
if (shape.nodeName.toLowerCase() == 'polygon') {
|
||||
poly.closePath();
|
||||
}
|
||||
|
||||
var exportedPolygon = poly.exportSVG();
|
||||
|
||||
var svgPoints = shape.getAttribute('points');
|
||||
|
||||
var exportedPoints = shape.getAttribute('points');
|
||||
|
||||
equals(svgPoints, exportedPoints);
|
||||
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('Export SVG polygon', function() {
|
||||
var points = '100,10 40,180 190,60 10,60 160,180';
|
||||
var path = createPolyPath(points);
|
||||
path.closePath();
|
||||
equals(path.exportSVG({ matchShapes: true }), createSVG('polygon', {
|
||||
points: points
|
||||
}));
|
||||
});
|
||||
|
||||
test('compare negative polyline values', function() {
|
||||
var svgns = 'http://www.w3.org/2000/svg';
|
||||
var shape = document.createElementNS(svgns, 'polyline');
|
||||
var svgpoints = "-5,-5 -45,-45 -5,-45 -45,-5";
|
||||
shape.setAttribute('points', svgpoints);
|
||||
|
||||
var poly = new Path();
|
||||
var points = shape.points;
|
||||
var start = points.getItem(0);
|
||||
var point;
|
||||
poly.moveTo([start.x, start.y]);
|
||||
|
||||
for (var i = 1; i < points.length; i++) {
|
||||
point = points.getItem(i);
|
||||
poly.lineTo([point.x, point.y]);
|
||||
}
|
||||
if (shape.nodeName.toLowerCase() == 'polygon') {
|
||||
poly.closePath();
|
||||
}
|
||||
|
||||
var exportedPolygon = poly.exportSVG();
|
||||
|
||||
var svgPoints = shape.getAttribute('points');
|
||||
|
||||
var exportedPoints = shape.getAttribute('points');
|
||||
|
||||
equals(svgPoints, exportedPoints);
|
||||
|
||||
test('Export SVG polyline', function() {
|
||||
var points = '5,5 45,45 5,45 45,5';
|
||||
var path = createPolyPath(points);
|
||||
equals(path.exportSVG({ matchShapes: true }), createSVG('polyline', {
|
||||
points: points
|
||||
}));
|
||||
});
|
||||
|
||||
|
|
|
@ -12,12 +12,6 @@
|
|||
|
||||
module('SVGImport');
|
||||
|
||||
test('Import complex CompoundPath and clone', function() {
|
||||
var svg = createSVG('<path id="path" fill="red" d="M4,14h20v-2H4V14z M15,26h7v-2h-7V26z M15,22h9v-2h-9V22z M15,18h9v-2h-9V18z M4,26h9V16H4V26z M28,10V6H0v22c0,0,0,4,4,4 h25c0,0,3-0.062,3-4V10H28z M4,30c-2,0-2-2-2-2V8h24v20c0,0.921,0.284,1.558,0.676,2H4z"/>;');
|
||||
var item = paper.project.importSVG(svg.getElementById('path'));
|
||||
equals(item, item.clone(), null, { cloned: true });
|
||||
});
|
||||
|
||||
test('Import SVG line', function() {
|
||||
var attrs = {
|
||||
x1: 5,
|
||||
|
@ -112,10 +106,16 @@ test('Import SVG polygon', function() {
|
|||
});
|
||||
|
||||
test('Import SVG polyline', function() {
|
||||
var points = "5,5 45,45 5,45 45,5";
|
||||
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('<path id="path" fill="red" d="M4,14h20v-2H4V14z M15,26h7v-2h-7V26z M15,22h9v-2h-9V22z M15,18h9v-2h-9V18z M4,26h9V16H4V26z M28,10V6H0v22c0,0,0,4,4,4 h25c0,0,3-0.062,3-4V10H28z M4,30c-2,0-2-2-2-2V8h24v20c0,0.921,0.284,1.558,0.676,2H4z"/>;');
|
||||
var item = paper.project.importSVG(svg.getElementById('path'));
|
||||
equals(item, item.clone(), null, { cloned: true });
|
||||
});
|
||||
|
|
|
@ -59,6 +59,7 @@
|
|||
|
||||
/*#*/ include('HitResult.js');
|
||||
|
||||
/*#*/ include('JSON.js');
|
||||
|
||||
/*#*/ include('SVGImport.js');
|
||||
/*#*/ include('SVGExport.js');
|
||||
/*#*/ include('JSON.js');
|
||||
|
|
Loading…
Reference in a new issue