Adding specs and some refactoring for the Path#lineTo method
This commit is contained in:
parent
381df8bf93
commit
bb37848265
@ -75,7 +75,7 @@ exports[`VerticalLayout rendering with connectors 1`] = `
|
|||||||
withConnectors={true}
|
withConnectors={true}
|
||||||
>
|
>
|
||||||
<path
|
<path
|
||||||
d="M10,60q0,-10 10,-10H20M130,60q0,-10 -10,-10H120M0,160c15,0 10,0 20,0H20M140,160c-15,0 -10,0 -20,0H120M10,260q0,10 10,10H20M130,260q0,10 -10,10H120M0,160q10,0 10,-10V60M140,160q-10,0 -10,-10V60M0,160q10,0 10,10V260M140,160q-10,0 -10,10V260"
|
d="M10,60q0,-10 10,-10M130,60q0,-10 -10,-10M0,160c15,0 10,0 20,0M140,160c-15,0 -10,0 -20,0M10,260q0,10 10,10M130,260q0,10 -10,10M0,160q10,0 10,-10V60M140,160q-10,0 -10,-10V60M0,160q10,0 10,10V260M140,160q-10,0 -10,10V260"
|
||||||
style={
|
style={
|
||||||
Object {
|
Object {
|
||||||
"fillOpacity": 0,
|
"fillOpacity": 0,
|
||||||
|
@ -26,22 +26,37 @@ class Path {
|
|||||||
}
|
}
|
||||||
|
|
||||||
lineTo({ x, y, relative }) {
|
lineTo({ x, y, relative }) {
|
||||||
relative = relative === undefined ? this.relative : relative;
|
if (relative === undefined) {
|
||||||
if (x !== undefined && (y === undefined || y === this.currentPosition.y)) {
|
relative = this.relative;
|
||||||
|
}
|
||||||
|
if (x === undefined) {
|
||||||
|
x = relative ? 0 : this.currentPosition.x;
|
||||||
|
}
|
||||||
|
if (y === undefined) {
|
||||||
|
y = relative ? 0 : this.currentPosition.y;
|
||||||
|
}
|
||||||
|
|
||||||
|
if ((relative && x === 0 && y === 0)
|
||||||
|
|| (!relative && x === this.currentPosition.x && y === this.currentPosition.y)) {
|
||||||
|
return this;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (y === (relative ? 0 : this.currentPosition.y)) {
|
||||||
const command = relative ? 'h' : 'H';
|
const command = relative ? 'h' : 'H';
|
||||||
this.pathParts.push(`${command}${x}`);
|
this.pathParts.push(`${command}${x}`);
|
||||||
this.currentPosition.x = relative ? this.currentPosition.x + x : x;
|
} else if (x === (relative ? 0 : this.currentPosition.x)) {
|
||||||
} else if (y !== undefined && (x === undefined || x === this.currentPosition.x)) {
|
|
||||||
const command = relative ? 'v' : 'V';
|
const command = relative ? 'v' : 'V';
|
||||||
this.pathParts.push(`${command}${y}`);
|
this.pathParts.push(`${command}${y}`);
|
||||||
this.currentPosition.y = relative ? this.currentPosition.y + y : y;
|
|
||||||
} else {
|
} else {
|
||||||
const command = relative ? 'l' : 'L';
|
const command = relative ? 'l' : 'L';
|
||||||
this.pathParts.push(`${command}${x},${y}`);
|
this.pathParts.push(`${command}${x},${y}`);
|
||||||
this.currentPosition.x = relative ? this.currentPosition.x + x : x;
|
|
||||||
this.currentPosition.y = relative ? this.currentPosition.y + y : y;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
this.currentPosition = {
|
||||||
|
x: relative ? this.currentPosition.x + x : x,
|
||||||
|
y: relative ? this.currentPosition.y + y : y
|
||||||
|
};
|
||||||
|
|
||||||
return this;
|
return this;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
27
src/components/SVG/path.test.js
Normal file
27
src/components/SVG/path.test.js
Normal file
@ -0,0 +1,27 @@
|
|||||||
|
import Path from './path';
|
||||||
|
|
||||||
|
describe('Path', () => {
|
||||||
|
[
|
||||||
|
// lineTo
|
||||||
|
[ 'lineTo', { x: 5, y: 1 }, 'L5,1' ],
|
||||||
|
[ 'lineTo', { x: 5, y: 0 }, 'H5' ],
|
||||||
|
[ 'lineTo', { x: 0, y: 1 }, 'V1' ],
|
||||||
|
[ 'lineTo', { x: 0, y: 0 }, '' ],
|
||||||
|
[ 'lineTo', { x: 5 }, 'H5' ],
|
||||||
|
[ 'lineTo', { y: 1 }, 'V1' ],
|
||||||
|
[ 'lineTo', {}, '' ],
|
||||||
|
[ 'lineTo', { x: 5, y: 1, relative: true }, 'l5,1' ],
|
||||||
|
[ 'lineTo', { x: 5, y: 0, relative: true }, 'h5' ],
|
||||||
|
[ 'lineTo', { x: 0, y: 1, relative: true }, 'v1' ],
|
||||||
|
[ 'lineTo', { x: 0, y: 0, relative: true }, '' ],
|
||||||
|
[ 'lineTo', { x: 5, relative: true }, 'h5' ],
|
||||||
|
[ 'lineTo', { y: 1, relative: true }, 'v1' ],
|
||||||
|
[ 'lineTo', { relative: true }, '' ],
|
||||||
|
].forEach(([ cmd, args, str ], i) => (
|
||||||
|
test(`case #${ i }`, () => {
|
||||||
|
const path = new Path();
|
||||||
|
path[cmd](args);
|
||||||
|
expect(path.toString()).toEqual(str);
|
||||||
|
})
|
||||||
|
));
|
||||||
|
});
|
Loading…
Reference in New Issue
Block a user