Skip to content

Commit 01909bf

Browse files
committed
refactor: rename curve from circuler
1 parent a3f9a01 commit 01909bf

File tree

7 files changed

+109
-117
lines changed

7 files changed

+109
-117
lines changed

README.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -75,7 +75,7 @@ draw.clear()
7575
// undo drawing
7676
draw.undo()
7777

78-
// change parameter. There are other changeable parameters like fill, close, circuler, etc.
78+
// change parameter. There are other changeable parameters like fill, close, curve, etc.
7979
draw.penColor = '#00b'
8080
draw.penWidth = 10
8181

src/__snapshots__/svg.test.ts.snap

+65-65
Original file line numberDiff line numberDiff line change
@@ -1,72 +1,69 @@
11
// Jest Snapshot v1, https://goo.gl/fbAQLP
22

3-
exports[`svg Path formatCommand and getCommandString Circuler Close 1`] = `
3+
exports[`svg Path commands parameter and getCommandString Line Close 1`] = `
44
Array [
55
Command {
66
"point": Point {
77
"x": 0,
88
"y": 0,
99
},
10-
"type": 0,
10+
"type": "M",
1111
},
1212
Command {
13-
"cl": Point {
14-
"x": 0.2,
15-
"y": 0.2,
16-
},
17-
"cr": Point {
18-
"x": 0.6,
19-
"y": 0.8,
20-
},
2113
"point": Point {
2214
"x": 1,
2315
"y": 1,
2416
},
25-
"type": 2,
17+
"type": "L",
2618
},
2719
Command {
28-
"cl": Point {
29-
"x": 1.4,
30-
"y": 1.2,
20+
"point": Point {
21+
"x": -1,
22+
"y": -1,
3123
},
32-
"cr": Point {
33-
"x": 1.6,
34-
"y": 1.2,
24+
"type": "L",
25+
},
26+
]
27+
`;
28+
29+
exports[`svg Path commands parameter and getCommandString Line Close 2`] = `"M 0 0 L 1 1 L -1 -1 Z"`;
30+
31+
exports[`svg Path commands parameter and getCommandString Line Normal 1`] = `
32+
Array [
33+
Command {
34+
"point": Point {
35+
"x": 0,
36+
"y": 0,
3537
},
38+
"type": "M",
39+
},
40+
Command {
3641
"point": Point {
37-
"x": 2,
42+
"x": 1,
3843
"y": 1,
3944
},
40-
"type": 2,
45+
"type": "L",
4146
},
4247
Command {
43-
"cl": Point {
44-
"x": 2.4,
45-
"y": 0.8,
46-
},
47-
"cr": Point {
48-
"x": 2.8,
49-
"y": 0.2,
50-
},
5148
"point": Point {
52-
"x": 3,
53-
"y": 0,
49+
"x": -1,
50+
"y": -1,
5451
},
55-
"type": 2,
52+
"type": "L",
5653
},
5754
]
5855
`;
5956

60-
exports[`svg Path formatCommand and getCommandString Circuler Close 2`] = `"M 0 0 C 0.2 0.2 0.6 0.8 1 1 C 1.4 1.2 1.6 1.2 2 1 C 2.4 0.8 2.8 0.2 3 0 Z"`;
57+
exports[`svg Path commands parameter and getCommandString Line Normal 2`] = `"M 0 0 L 1 1 L -1 -1"`;
6158

62-
exports[`svg Path formatCommand and getCommandString Circuler Normal 1`] = `
59+
exports[`svg Path commands parameter and getCommandString curve Close 1`] = `
6360
Array [
6461
Command {
6562
"point": Point {
6663
"x": 0,
6764
"y": 0,
6865
},
69-
"type": 0,
66+
"type": "M",
7067
},
7168
Command {
7269
"cl": Point {
@@ -81,7 +78,7 @@ Array [
8178
"x": 1,
8279
"y": 1,
8380
},
84-
"type": 2,
81+
"type": "C",
8582
},
8683
Command {
8784
"cl": Point {
@@ -96,7 +93,7 @@ Array [
9693
"x": 2,
9794
"y": 1,
9895
},
99-
"type": 2,
96+
"type": "C",
10097
},
10198
Command {
10299
"cl": Point {
@@ -111,68 +108,71 @@ Array [
111108
"x": 3,
112109
"y": 0,
113110
},
114-
"type": 2,
111+
"type": "C",
115112
},
116113
]
117114
`;
118115

119-
exports[`svg Path formatCommand and getCommandString Circuler Normal 2`] = `"M 0 0 C 0.2 0.2 0.6 0.8 1 1 C 1.4 1.2 1.6 1.2 2 1 C 2.4 0.8 2.8 0.2 3 0"`;
116+
exports[`svg Path commands parameter and getCommandString curve Close 2`] = `"M 0 0 C 0.2 0.2 0.6 0.8 1 1 C 1.4 1.2 1.6 1.2 2 1 C 2.4 0.8 2.8 0.2 3 0 Z"`;
120117

121-
exports[`svg Path formatCommand and getCommandString Line Close 1`] = `
118+
exports[`svg Path commands parameter and getCommandString curve Normal 1`] = `
122119
Array [
123120
Command {
124121
"point": Point {
125122
"x": 0,
126123
"y": 0,
127124
},
128-
"type": 0,
125+
"type": "M",
129126
},
130127
Command {
128+
"cl": Point {
129+
"x": 0.2,
130+
"y": 0.2,
131+
},
132+
"cr": Point {
133+
"x": 0.6,
134+
"y": 0.8,
135+
},
131136
"point": Point {
132137
"x": 1,
133138
"y": 1,
134139
},
135-
"type": 1,
140+
"type": "C",
136141
},
137142
Command {
138-
"point": Point {
139-
"x": -1,
140-
"y": -1,
143+
"cl": Point {
144+
"x": 1.4,
145+
"y": 1.2,
141146
},
142-
"type": 1,
143-
},
144-
]
145-
`;
146-
147-
exports[`svg Path formatCommand and getCommandString Line Close 2`] = `"M 0 0 L 1 1 L -1 -1 Z"`;
148-
149-
exports[`svg Path formatCommand and getCommandString Line Normal 1`] = `
150-
Array [
151-
Command {
152-
"point": Point {
153-
"x": 0,
154-
"y": 0,
147+
"cr": Point {
148+
"x": 1.6,
149+
"y": 1.2,
155150
},
156-
"type": 0,
157-
},
158-
Command {
159151
"point": Point {
160-
"x": 1,
152+
"x": 2,
161153
"y": 1,
162154
},
163-
"type": 1,
155+
"type": "C",
164156
},
165157
Command {
158+
"cl": Point {
159+
"x": 2.4,
160+
"y": 0.8,
161+
},
162+
"cr": Point {
163+
"x": 2.8,
164+
"y": 0.2,
165+
},
166166
"point": Point {
167-
"x": -1,
168-
"y": -1,
167+
"x": 3,
168+
"y": 0,
169169
},
170-
"type": 1,
170+
"type": "C",
171171
},
172172
]
173173
`;
174174

175-
exports[`svg Path formatCommand and getCommandString Line Normal 2`] = `"M 0 0 L 1 1 L -1 -1"`;
175+
exports[`svg Path commands parameter and getCommandString curve Normal 2`] = `"M 0 0 C 0.2 0.2 0.6 0.8 1 1 C 1.4 1.2 1.6 1.2 2 1 C 2.4 0.8 2.8 0.2 3 0"`;
176176

177177
exports[`svg Path toJson and toElement toElement 1`] = `
178178
<path

src/drawing.ts

+5-5
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ export interface DrawingOption extends RendererOption {
77
penColor?: string
88
penWidth?: number
99
close?: boolean
10-
circuler?: boolean
10+
curve?: boolean
1111
delay?: number
1212
fill?: string
1313
}
@@ -16,7 +16,7 @@ export class SvgDrawing extends Renderer {
1616
public penColor: string
1717
public penWidth: number
1818
public fill: string
19-
public circuler: boolean
19+
public curve: boolean
2020
public close: boolean
2121
public delay: number
2222
private _drawPath: Path | null
@@ -28,7 +28,7 @@ export class SvgDrawing extends Renderer {
2828
{
2929
penColor,
3030
penWidth,
31-
circuler,
31+
curve,
3232
close,
3333
delay,
3434
fill,
@@ -41,7 +41,7 @@ export class SvgDrawing extends Renderer {
4141
*/
4242
this.penColor = penColor ?? '#333'
4343
this.penWidth = penWidth ?? 1
44-
this.circuler = circuler ?? true
44+
this.curve = curve ?? true
4545
this.close = close ?? false
4646
this.delay = delay ?? 20
4747
this.fill = fill ?? 'none'
@@ -124,7 +124,7 @@ export class SvgDrawing extends Renderer {
124124
this.resize()
125125
return new Path({
126126
close: this.close,
127-
circuler: this.circuler,
127+
curve: this.curve,
128128
stroke: this.penColor,
129129
strokeWidth: this.penWidth,
130130
fill: this.fill

src/example/app.tsx

+7-7
Original file line numberDiff line numberDiff line change
@@ -103,7 +103,7 @@ const Example = () => {
103103
const [rainbowPen, switchRainbowpen] = useState(false)
104104
// TODO: fix
105105
// const [thinner, switchThinner] = useState(true)
106-
const [circuler, switchCirculer] = useState(true)
106+
const [curve, switchCurve] = useState(true)
107107
const [close, switchClose] = useState(false)
108108
const [fill, setFill] = useState('none')
109109
const [penColor, setPenColor] = useState('black')
@@ -145,9 +145,9 @@ const Example = () => {
145145
// }, [])
146146
const handleChangeCiruler = useCallback(() => {
147147
if (!drawingRef.current) return
148-
drawingRef.current.circuler = !circuler
149-
switchCirculer(!circuler)
150-
}, [circuler])
148+
drawingRef.current.curve = !curve
149+
switchCurve(!curve)
150+
}, [curve])
151151

152152
const handleChangeClose = useCallback(() => {
153153
if (!drawingRef.current) return
@@ -229,7 +229,7 @@ const Example = () => {
229229
if (drawingRef.current) return
230230
if (!divRef.current) return
231231
drawingRef.current = new SvgDrawing(divRef.current, {
232-
circuler,
232+
curve,
233233
close,
234234
delay,
235235
penWidth,
@@ -345,10 +345,10 @@ const Example = () => {
345345
<label>
346346
<input
347347
type="checkbox"
348-
checked={circuler}
348+
checked={curve}
349349
onChange={handleChangeCiruler}
350350
/>
351-
Circuler
351+
Curve
352352
</label>
353353
{!rainbowPen && (
354354
<>

src/renderer.test.ts

+2-4
Original file line numberDiff line numberDiff line change
@@ -9,20 +9,18 @@ describe('renderer', () => {
99
renderer = new Renderer(el)
1010

1111
.addPath(
12-
new Path({ circuler: true, close: false })
12+
new Path({ curve: true, close: false })
1313
.addCommand(new Point(0, 0))
1414
.addCommand(new Point(1, 1))
1515
.addCommand(new Point(2, 1))
1616
.addCommand(new Point(3, 0))
17-
.formatCommand()
1817
)
1918
.addPath(
20-
new Path({ circuler: false, close: true })
19+
new Path({ curve: false, close: true })
2120
.addCommand(new Point(4, 4))
2221
.addCommand(new Point(9, 4))
2322
.addCommand(new Point(9, 8))
2423
.addCommand(new Point(3, 0))
25-
.formatCommand()
2624
)
2725
})
2826
it('download svg', done => {

src/svg.test.ts

+8-8
Original file line numberDiff line numberDiff line change
@@ -119,22 +119,22 @@ describe('svg', () => {
119119
expect(clone.commands[0].point.x).toBe(3)
120120
})
121121
describe('toJson and toElement', () => {
122-
const path = new Path({ circuler: true, close: false })
122+
const path = new Path({ curve: true, close: false })
123123
.addCommand(new Point(0, 0))
124124
.addCommand(new Point(1, 1))
125125
.addCommand(new Point(2, 1))
126126
.addCommand(new Point(3, 0))
127-
.formatCommand()
127+
128128
it('toJson', () => {
129129
expect(path.toJson()).toMatchSnapshot()
130130
})
131131
it('toElement', () => {
132132
expect(path.toElement()).toMatchSnapshot()
133133
})
134134
})
135-
describe('formatCommand and getCommandString', () => {
135+
describe('commands parameter and getCommandString', () => {
136136
describe('Line', () => {
137-
const path = new Path({ circuler: false })
137+
const path = new Path({ curve: false })
138138
.addCommand(new Point(0, 0))
139139
.addCommand(new Point(1, 1))
140140
.addCommand(new Point(-1, -1))
@@ -149,8 +149,8 @@ describe('svg', () => {
149149
expect(path.getCommandString()).toMatchSnapshot()
150150
})
151151
})
152-
describe('Circuler', () => {
153-
const path = new Path({ circuler: true })
152+
describe('curve', () => {
153+
const path = new Path({ curve: true })
154154
.addCommand(new Point(0, 0))
155155
.addCommand(new Point(1, 1))
156156
.addCommand(new Point(2, 1))
@@ -173,14 +173,14 @@ describe('svg', () => {
173173
beforeEach(() => {
174174
svg = new Svg({ width: 500, height: 500 })
175175
.addPath(
176-
new Path({ circuler: true, close: false })
176+
new Path({ curve: true, close: false })
177177
.addCommand(new Point(0, 0))
178178
.addCommand(new Point(1, 1))
179179
.addCommand(new Point(2, 1))
180180
.addCommand(new Point(3, 0))
181181
)
182182
.addPath(
183-
new Path({ circuler: false, close: true })
183+
new Path({ curve: false, close: true })
184184
.addCommand(new Point(4, 4))
185185
.addCommand(new Point(9, 4))
186186
.addCommand(new Point(9, 8))

0 commit comments

Comments
 (0)