@leafer/path 1.0.0-rc.1 → 1.0.0-rc.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@leafer/path",
-  "version": "1.0.0-rc.1",
+  "version": "1.0.0-rc.10",
   "description": "@leafer/path",
   "author": "Chao (Leafer) Wan",
   "license": "MIT",
@@ -22,10 +22,10 @@
     "leaferjs"
   ],
   "dependencies": {
-    "@leafer/math": "1.0.0-rc.1",
-    "@leafer/debug": "1.0.0-rc.1"
+    "@leafer/math": "1.0.0-rc.10",
+    "@leafer/debug": "1.0.0-rc.10"
   },
   "devDependencies": {
-    "@leafer/interface": "1.0.0-rc.1"
+    "@leafer/interface": "1.0.0-rc.10"
   }
 }

package/src/EllipseHelper.ts

@@ -1,9 +1,11 @@
 import { IPathCommandData } from '@leafer/interface'
 import { OneRadian, PI2 } from '@leafer/math'
+import { Platform } from '@leafer/platform'
 
 import { PathCommandMap } from './PathCommandMap'
 import { BezierHelper } from './BezierHelper'
 
+
 const { sin, cos, sqrt, atan2 } = Math
 const { ellipse } = BezierHelper
 
@@ -56,7 +58,7 @@ export const EllipseHelper = {
 
         const anticlockwise = totalRadian < 0 ? 1 : 0
 
-        if (curveMode) {
+        if (curveMode || Platform.ellipseToCurve) {
             ellipse(data, centerX, centerY, radiusX, radiusY, rotation, startRadian / OneRadian, endRadian / OneRadian, anticlockwise as unknown as boolean)
         } else {
             if (radiusX === radiusY && !rotation) {

package/src/PathBounds.ts

@@ -8,7 +8,7 @@ import { PathCommandMap as Command } from './PathCommandMap'
 
 const { M, L, C, Q, Z, N, D, X, G, F, O, P, U } = Command
 const { toTwoPointBounds, toTwoPointBoundsByQuadraticCurve, arcTo, arc, ellipse } = BezierHelper
-const { add, copy, addPoint, setPoint, addBounds, toBounds } = TwoPointBoundsHelper
+const { addPointBounds, copy, addPoint, setPoint, addBounds, toBounds } = TwoPointBoundsHelper
 const debug = Debug.get('PathBounds')
 
 let radius: number, radiusX: number, radiusY: number
@@ -54,7 +54,7 @@ export const PathBounds = {
                     toX = data[i + 5]
                     toY = data[i + 6]
                     toTwoPointBounds(x, y, data[i + 1], data[i + 2], data[i + 3], data[i + 4], toX, toY, tempPointBounds)
-                    add(setPointBounds, tempPointBounds)
+                    addPointBounds(setPointBounds, tempPointBounds)
                     x = toX
                     y = toY
                     i += 7
@@ -65,7 +65,7 @@ export const PathBounds = {
                     toX = data[i + 3]
                     toY = data[i + 4]
                     toTwoPointBoundsByQuadraticCurve(x, y, x1, y1, toX, toY, tempPointBounds)
-                    add(setPointBounds, tempPointBounds)
+                    addPointBounds(setPointBounds, tempPointBounds)
                     x = toX
                     y = toY
                     i += 5
@@ -91,7 +91,7 @@ export const PathBounds = {
                     break
                 case G: // ellipse(x, y, radiusX, radiusY, rotation, startAngle, endAngle, anticlockwise)
                     ellipse(null, data[i + 1], data[i + 2], data[i + 3], data[i + 4], data[i + 5], data[i + 6], data[i + 7], data[i + 8] as unknown as boolean, tempPointBounds, setEndPoint)
-                    i === 0 ? copy(setPointBounds, tempPointBounds) : add(setPointBounds, tempPointBounds)
+                    i === 0 ? copy(setPointBounds, tempPointBounds) : addPointBounds(setPointBounds, tempPointBounds)
                     x = setEndPoint.x
                     y = setEndPoint.y
                     i += 9
@@ -107,7 +107,7 @@ export const PathBounds = {
                     break
                 case O: // arc(x, y, radius, startAngle, endAngle, anticlockwise)
                     arc(null, data[i + 1], data[i + 2], data[i + 3], data[i + 4], data[i + 5], data[i + 6] as unknown as boolean, tempPointBounds, setEndPoint)
-                    i === 0 ? copy(setPointBounds, tempPointBounds) : add(setPointBounds, tempPointBounds)
+                    i === 0 ? copy(setPointBounds, tempPointBounds) : addPointBounds(setPointBounds, tempPointBounds)
                     x = setEndPoint.x
                     y = setEndPoint.y
                     i += 7
@@ -122,7 +122,7 @@ export const PathBounds = {
                     break
                 case U: // arcTo(x1, y1, x2, y2, radius)
                     arcTo(null, x, y, data[i + 1], data[i + 2], data[i + 3], data[i + 4], data[i + 5], tempPointBounds, setEndPoint)
-                    i === 0 ? copy(setPointBounds, tempPointBounds) : add(setPointBounds, tempPointBounds)
+                    i === 0 ? copy(setPointBounds, tempPointBounds) : addPointBounds(setPointBounds, tempPointBounds)
                     x = setEndPoint.x
                     y = setEndPoint.y
                     i += 6

package/src/PathCommandDataHelper.ts

@@ -1,10 +1,13 @@
 import { IPathCommandData, IPointData } from '@leafer/interface'
+import { MathHelper, PointHelper } from '@leafer/math'
+
 import { PathCommandMap } from './PathCommandMap'
 import { BezierHelper } from './BezierHelper'
-import { MathHelper } from '@leafer/math'
 
 
 const { M, L, C, Q, Z, N, D, X, G, F, O, P, U } = PathCommandMap
+const { getMinDistanceFrom, getRadianFrom } = PointHelper
+const { tan, min, abs } = Math
 const startPoint = {} as IPointData
 
 export const PathCommandDataHelper = {
@@ -73,8 +76,13 @@ export const PathCommandDataHelper = {
         }
     },
 
-    arcTo(data: IPathCommandData, x1: number, y1: number, x2: number, y2: number, radius: number): void {
-        data.push(U, x1, y1, x2, y2, radius)
+    arcTo(data: IPathCommandData, x1: number, y1: number, x2: number, y2: number, radius: number, lastX?: number, lastY?: number): void {
+        if (lastX !== undefined) {
+            const maxRadius = tan(getRadianFrom(lastX, lastY, x1, y1, x2, y2) / 2) * (getMinDistanceFrom(lastX, lastY, x1, y1, x2, y2) / 2)
+            data.push(U, x1, y1, x2, y2, min(radius, abs(maxRadius)))
+        } else {
+            data.push(U, x1, y1, x2, y2, radius)
+        }
     },
 
     // new

package/src/PathConvert.ts

@@ -1,5 +1,5 @@
 import { IPathCommandData, IPointData } from '@leafer/interface'
-import { StringNumberMap } from '@leafer/math'
+import { MathHelper, StringNumberMap } from '@leafer/math'
 import { Debug } from '@leafer/debug'
 
 import { PathCommandMap as Command, NeedConvertToCanvasCommandMap, NeedConvertToCurveCommandMap, PathCommandLengthMap, PathNumberCommandMap, PathNumberCommandLengthMap } from './PathCommandMap'
@@ -26,7 +26,7 @@ export const PathConvert = {
 
     current: { dot: 0 } as ICurrentCommand,
 
-    stringify(data: IPathCommandData): string {
+    stringify(data: IPathCommandData, floatLength?: number): string {
         let i = 0, len = data.length, count: number, str: string = '', command: number, lastCommand: number
         while (i < len) {
             command = data[i]
@@ -38,7 +38,7 @@ export const PathConvert = {
             }
 
             for (let j = 1; j < count; j++) {
-                str += data[i + j];
+                str += MathHelper.float(data[i + j], floatLength);
                 (j === count - 1) || (str += ' ')
             }
 

package/src/PathCorner.ts

@@ -1,10 +1,74 @@
 import { IPathCommandData } from '@leafer/interface'
+import { PointHelper } from '@leafer/math'
 
+import { PathCommandMap as Command } from './PathCommandMap'
+import { PathCommandDataHelper } from './PathCommandDataHelper'
+
+
+const { M, L, C, Z } = Command
+const { getCenterX, getCenterY } = PointHelper
+const { arcTo } = PathCommandDataHelper
 
 export const PathCorner = {
 
-    smooth(data: IPathCommandData, _cornerRadius: number, _cornerSmoothing?: number): IPathCommandData {
-        return data
+    smooth(data: IPathCommandData, cornerRadius: number, _cornerSmoothing?: number): IPathCommandData {
+        let command: number
+        let i = 0, x = 0, y = 0, startX = 0, startY = 0, secondX = 0, secondY = 0, lastX = 0, lastY = 0
+
+        const len = data.length
+        const smooth: IPathCommandData = []
+
+        while (i < len) {
+            command = data[i]
+            switch (command) {
+                case M:  //moveto(x, y)
+                    startX = lastX = data[i + 1]
+                    startY = lastY = data[i + 2]
+                    i += 3
+                    if (data[i] === L) { // next lineTo
+                        secondX = data[i + 1]
+                        secondY = data[i + 2]
+                        smooth.push(M, getCenterX(startX, secondX), getCenterY(startY, secondY))
+                    } else {
+                        smooth.push(M, startX, startY)
+                    }
+                    break
+                case L:  //lineto(x, y)
+                    x = data[i + 1]
+                    y = data[i + 2]
+                    i += 3
+                    switch (data[i]) { // next command
+                        case L: // lineTo()
+                            arcTo(smooth, x, y, data[i + 1], data[i + 2], cornerRadius, lastX, lastY) // use arcTo(x1, y1, x2, y2, radius)
+                            break
+                        case Z: // closePath()
+                            arcTo(smooth, x, y, startX, startY, cornerRadius, lastX, lastY) // use arcTo(x1, y1, x2, y2, radius)
+                            break
+                        default:
+                            smooth.push(L, x, y)
+                    }
+                    lastX = x
+                    lastY = y
+                    break
+                case C:  //bezierCurveTo(x1, y1, x2, y2, x, y)
+                    smooth.push(C, data[i + 1], data[i + 2], data[i + 3], data[i + 4], data[i + 5], data[i + 6])
+                    i += 7
+                    break
+                case Z:  //closepath()
+                    arcTo(smooth, startX, startY, secondX, secondY, cornerRadius, lastX, lastY) // use arcTo(x1, y1, x2, y2, radius)
+                    smooth.push(Z)
+                    i += 1
+                    break
+
+            }
+        }
+
+        if (command !== Z) {
+            smooth[1] = startX
+            smooth[2] = startY
+        }
+
+        return smooth
     }
 
 }

package/src/RectHelper.ts

@@ -4,19 +4,16 @@ import { MathHelper } from '@leafer/math'
 export const RectHelper = {
 
     drawRoundRect(drawer: IPathDrawer, x: number, y: number, width: number, height: number, cornerRadius: number | number[]): void {
-        let [topLeft, topRight, bottomRight, bottomLeft] = MathHelper.fourNumber(cornerRadius)
+        const data = MathHelper.fourNumber(cornerRadius, Math.min(width / 2, height / 2))
 
-        const max = Math.min(width / 2, height / 2)
-        if (topLeft > max) topLeft = max
-        if (topRight > max) topRight = max
-        if (bottomRight > max) bottomRight = max
-        if (bottomLeft > max) bottomLeft = max
+        const right = x + width
+        const bottom = y + height
 
-        topLeft ? drawer.moveTo(x + topLeft, y) : drawer.moveTo(x, y)
-        topRight ? drawer.arcTo(x + width, y, x + width, y + height, topRight) : drawer.lineTo(x + width, y)
-        bottomRight ? drawer.arcTo(x + width, y + height, x, y + height, bottomRight) : drawer.lineTo(x + width, y + height)
-        bottomLeft ? drawer.arcTo(x, y + height, x, y, bottomLeft) : drawer.lineTo(x, y + height)
-        topLeft ? drawer.arcTo(x, y, x + width, y, topLeft) : drawer.lineTo(x, y)
+        data[0] ? drawer.moveTo(x + data[0], y) : drawer.moveTo(x, y)
+        data[1] ? drawer.arcTo(right, y, right, bottom, data[1]) : drawer.lineTo(right, y)
+        data[2] ? drawer.arcTo(right, bottom, x, bottom, data[2]) : drawer.lineTo(right, bottom)
+        data[3] ? drawer.arcTo(x, bottom, x, y, data[3]) : drawer.lineTo(x, bottom)
+        data[0] ? drawer.arcTo(x, y, right, y, data[0]) : drawer.lineTo(x, y)
     }
 
 }

package/types/index.d.ts

@@ -14,7 +14,7 @@ interface ICurrentCommand {
 }
 declare const PathConvert: {
     current: ICurrentCommand;
-    stringify(data: IPathCommandData): string;
+    stringify(data: IPathCommandData, floatLength?: number): string;
     parse(pathString: string, curveMode?: boolean): IPathCommandData;
     toCanvasData(old: IPathCommandData, curveMode?: boolean): IPathCommandData;
     copyData(data: IPathCommandData, old: IPathCommandData, index: number, count: number): void;
@@ -51,7 +51,7 @@ declare const PathCommandDataHelper: {
     roundRect(data: IPathCommandData, x: number, y: number, width: number, height: number, cornerRadius: number | number[]): void;
     ellipse(data: IPathCommandData, x: number, y: number, radiusX: number, radiusY: number, rotation?: number, startAngle?: number, endAngle?: number, anticlockwise?: boolean): void;
     arc(data: IPathCommandData, x: number, y: number, radius: number, startAngle?: number, endAngle?: number, anticlockwise?: boolean): void;
-    arcTo(data: IPathCommandData, x1: number, y1: number, x2: number, y2: number, radius: number): void;
+    arcTo(data: IPathCommandData, x1: number, y1: number, x2: number, y2: number, radius: number, lastX?: number, lastY?: number): void;
     drawEllipse(data: IPathCommandData, x: number, y: number, radiusX: number, radiusY: number, rotation?: number, startAngle?: number, endAngle?: number, anticlockwise?: boolean): void;
     drawArc(data: IPathCommandData, x: number, y: number, radius: number, startAngle?: number, endAngle?: number, anticlockwise?: boolean): void;
     drawPoints(data: IPathCommandData, points: number[], curve?: boolean | number, close?: boolean): void;
@@ -67,7 +67,7 @@ declare const PathBounds: {
 };
 
 declare const PathCorner: {
-    smooth(data: IPathCommandData, _cornerRadius: number, _cornerSmoothing?: number): IPathCommandData;
+    smooth(data: IPathCommandData, cornerRadius: number, _cornerSmoothing?: number): IPathCommandData;
 };
 
 declare const BezierHelper: {