@idraw/util 0.4.2 → 1.0.0-alpha.1

package/dist/esm/tool/path.js

@@ -0,0 +1,421 @@
+import { createId } from './id';
+export function shiftPathCommand(command, x, y) {
+    const { type } = command;
+    const params = [...command.params];
+    const id = command.id;
+    let anchorInfo = { id };
+    if (command.start && command.end) {
+        const start = Object.assign({}, command.start);
+        const end = Object.assign({}, command.end);
+        start.x += x;
+        start.y += y;
+        end.x += x;
+        end.y += y;
+        anchorInfo = { id, start, end };
+    }
+    switch (type) {
+        case 'M': {
+            params[0] += x;
+            params[1] += y;
+            return Object.assign({ type, params }, anchorInfo);
+        }
+        case 'L': {
+            params[0] += x;
+            params[1] += y;
+            return Object.assign({ type, params }, anchorInfo);
+        }
+        case 'H': {
+            params[0] += x;
+            return Object.assign({ type, params }, anchorInfo);
+        }
+        case 'V': {
+            params[0] += y;
+            return Object.assign({ type, params }, anchorInfo);
+        }
+        case 'C': {
+            params[0] += x;
+            params[1] += y;
+            params[2] += x;
+            params[3] += y;
+            params[4] += x;
+            params[5] += y;
+            return Object.assign({ type, params }, anchorInfo);
+        }
+        case 'S': {
+            params[0] += x;
+            params[1] += y;
+            params[2] += x;
+            params[3] += y;
+            return Object.assign({ type, params }, anchorInfo);
+        }
+        case 'Q': {
+            params[0] += x;
+            params[1] += y;
+            params[2] += x;
+            params[3] += y;
+            return Object.assign({ type, params }, anchorInfo);
+        }
+        case 'T': {
+            params[0] += x;
+            params[1] += y;
+            return Object.assign({ type, params }, anchorInfo);
+        }
+        case 'A': {
+            params[5] += x;
+            params[6] += y;
+            return Object.assign({ type, params }, anchorInfo);
+        }
+        case 'Z': {
+            return Object.assign({ type, params }, anchorInfo);
+        }
+        default: {
+            return Object.assign({ type, params }, anchorInfo);
+        }
+    }
+}
+export function shiftPathCommands(commands, x, y) {
+    const cmds = [];
+    commands.forEach((command) => {
+        const cmd = shiftPathCommand(command, x, y);
+        cmds.push(cmd);
+    });
+    return cmds;
+}
+export function scalePathCommands(path, scaleX, scaleY) {
+    return path.map((cmd) => {
+        const { id, type, params } = cmd;
+        const newParams = [];
+        let anchorInfo = { id };
+        if (cmd.start && cmd.end) {
+            const start = Object.assign({}, cmd.start);
+            const end = Object.assign({}, cmd.end);
+            start.x *= scaleX;
+            start.y *= scaleY;
+            end.x *= scaleX;
+            end.y *= scaleY;
+            anchorInfo = { id, start, end };
+        }
+        switch (type.toUpperCase()) {
+            case 'M':
+            case 'L':
+            case 'T':
+                for (let i = 0; i < params.length; i += 2) {
+                    newParams.push(params[i] * scaleX, params[i + 1] * scaleY);
+                }
+                break;
+            case 'C':
+                for (let i = 0; i < params.length; i += 6) {
+                    newParams.push(params[i] * scaleX, params[i + 1] * scaleY, params[i + 2] * scaleX, params[i + 3] * scaleY, params[i + 4] * scaleX, params[i + 5] * scaleY);
+                }
+                break;
+            case 'S':
+                for (let i = 0; i < params.length; i += 4) {
+                    newParams.push(params[i] * scaleX, params[i + 1] * scaleY, params[i + 2] * scaleX, params[i + 3] * scaleY);
+                }
+                break;
+            case 'Q':
+                for (let i = 0; i < params.length; i += 4) {
+                    newParams.push(params[i] * scaleX, params[i + 1] * scaleY, params[i + 2] * scaleX, params[i + 3] * scaleY);
+                }
+                break;
+            case 'H':
+                params.forEach((val) => newParams.push(val * scaleX));
+                break;
+            case 'V':
+                params.forEach((val) => newParams.push(val * scaleY));
+                break;
+            case 'A':
+                for (let i = 0; i < params.length; i += 7) {
+                    newParams.push(params[i] * scaleX, params[i + 1] * scaleY, params[i + 2], params[i + 3], params[i + 4], params[i + 5] * scaleX, params[i + 6] * scaleY);
+                }
+                break;
+            case 'M':
+            case 'L':
+            case 'C':
+            case 'S':
+            case 'Q':
+            case 'T':
+            case 'A':
+            case 'H':
+            case 'V':
+                for (let i = 0; i < params.length; i++) {
+                    const isXParam = (type === 'a' && (i % 7 === 0 || i % 7 === 5)) ||
+                        type === 'h' ||
+                        (type !== 'v' && i % 2 === 0);
+                    newParams.push(params[i] * (isXParam ? scaleX : scaleY));
+                }
+                break;
+            default:
+                return Object.assign({ type, params: [...params] }, anchorInfo);
+        }
+        return Object.assign({ type, params: newParams }, anchorInfo);
+    });
+}
+export function convertPathCommandsToACLMZ(commands) {
+    const output = [];
+    let currentPoint = { x: 0, y: 0 };
+    let startPoint = { x: 0, y: 0 };
+    let prevControlPoint = null;
+    for (const command of commands) {
+        const type = command.type;
+        const params = command.params;
+        const isRelative = type === type.toLowerCase();
+        const absCommand = type.toUpperCase();
+        const id = command.id;
+        switch (absCommand) {
+            case 'M': {
+                const [x, y] = params;
+                const point = isRelative ? { x: currentPoint.x + x, y: currentPoint.y + y } : { x, y };
+                output.push({ id, type: 'M', params: [point.x, point.y], start: { x, y }, end: { x, y } });
+                currentPoint = point;
+                startPoint = point;
+                prevControlPoint = null;
+                break;
+            }
+            case 'L': {
+                const [x, y] = params;
+                const point = isRelative ? { x: currentPoint.x + x, y: currentPoint.y + y } : { x, y };
+                output.push({
+                    id,
+                    type: 'L',
+                    params: [point.x, point.y],
+                    start: Object.assign({}, currentPoint),
+                    end: Object.assign({}, point),
+                });
+                currentPoint = point;
+                prevControlPoint = null;
+                break;
+            }
+            case 'H': {
+                const [x] = params;
+                const point = isRelative ? { x: currentPoint.x + x, y: currentPoint.y } : { x, y: currentPoint.y };
+                output.push({
+                    id,
+                    type: 'L',
+                    params: [point.x, point.y],
+                    start: Object.assign({}, currentPoint),
+                    end: Object.assign({}, point),
+                });
+                currentPoint = point;
+                prevControlPoint = null;
+                break;
+            }
+            case 'V': {
+                const [y] = params;
+                const point = isRelative ? { x: currentPoint.x, y: currentPoint.y + y } : { x: currentPoint.x, y };
+                output.push({
+                    id,
+                    type: 'L',
+                    params: [point.x, point.y],
+                    start: Object.assign({}, currentPoint),
+                    end: Object.assign({}, point),
+                });
+                currentPoint = point;
+                prevControlPoint = null;
+                break;
+            }
+            case 'C': {
+                const [x1, y1, x2, y2, x, y] = params;
+                const c1 = isRelative ? { x: currentPoint.x + x1, y: currentPoint.y + y1 } : { x: x1, y: y1 };
+                const c2 = isRelative ? { x: currentPoint.x + x2, y: currentPoint.y + y2 } : { x: x2, y: y2 };
+                const point = isRelative ? { x: currentPoint.x + x, y: currentPoint.y + y } : { x, y };
+                output.push({
+                    id,
+                    type: 'C',
+                    params: [c1.x, c1.y, c2.x, c2.y, point.x, point.y],
+                    start: Object.assign({}, currentPoint),
+                    end: Object.assign({}, point),
+                });
+                currentPoint = point;
+                prevControlPoint = c2;
+                break;
+            }
+            case 'S': {
+                const [x2, y2, x, y] = params;
+                const c1 = prevControlPoint
+                    ? {
+                        x: 2 * currentPoint.x - prevControlPoint.x,
+                        y: 2 * currentPoint.y - prevControlPoint.y,
+                    }
+                    : currentPoint;
+                const c2 = isRelative ? { x: currentPoint.x + x2, y: currentPoint.y + y2 } : { x: x2, y: y2 };
+                const point = isRelative ? { x: currentPoint.x + x, y: currentPoint.y + y } : { x, y };
+                output.push({
+                    id,
+                    type: 'C',
+                    params: [c1.x, c1.y, c2.x, c2.y, point.x, point.y],
+                    start: Object.assign({}, currentPoint),
+                    end: Object.assign({}, point),
+                });
+                currentPoint = point;
+                prevControlPoint = c2;
+                break;
+            }
+            case 'Q': {
+                const [x1, y1, x, y] = params;
+                const cp1 = isRelative ? { x: currentPoint.x + x1, y: currentPoint.y + y1 } : { x: x1, y: y1 };
+                const endPoint = isRelative ? { x: currentPoint.x + x, y: currentPoint.y + y } : { x, y };
+                output.push({
+                    id,
+                    type: 'C',
+                    params: [
+                        currentPoint.x + (2 / 3) * (cp1.x - currentPoint.x),
+                        currentPoint.y + (2 / 3) * (cp1.y - currentPoint.y),
+                        endPoint.x + (2 / 3) * (cp1.x - endPoint.x),
+                        endPoint.y + (2 / 3) * (cp1.y - endPoint.y),
+                        endPoint.x,
+                        endPoint.y,
+                    ],
+                    start: Object.assign({}, currentPoint),
+                    end: Object.assign({}, endPoint),
+                });
+                currentPoint = endPoint;
+                prevControlPoint = cp1;
+                break;
+            }
+            case 'T': {
+                const [x, y] = params;
+                const endPoint = isRelative ? { x: currentPoint.x + x, y: currentPoint.y + y } : { x, y };
+                const cp1 = prevControlPoint
+                    ? {
+                        x: 2 * currentPoint.x - prevControlPoint.x,
+                        y: 2 * currentPoint.y - prevControlPoint.y,
+                    }
+                    : currentPoint;
+                output.push({
+                    id,
+                    type: 'C',
+                    params: [
+                        currentPoint.x + (2 / 3) * (cp1.x - currentPoint.x),
+                        currentPoint.y + (2 / 3) * (cp1.y - currentPoint.y),
+                        endPoint.x + (2 / 3) * (cp1.x - endPoint.x),
+                        endPoint.y + (2 / 3) * (cp1.y - endPoint.y),
+                        endPoint.x,
+                        endPoint.y,
+                    ],
+                    start: Object.assign({}, currentPoint),
+                    end: Object.assign({}, endPoint),
+                });
+                currentPoint = endPoint;
+                prevControlPoint = cp1;
+                break;
+            }
+            case 'A': {
+                const [rx, ry, rotation, largeArc, sweep, x, y] = params;
+                const point = isRelative ? { x: currentPoint.x + x, y: currentPoint.y + y } : { x, y };
+                output.push({
+                    id,
+                    type: 'A',
+                    params: [rx, ry, rotation, largeArc, sweep, point.x, point.y],
+                    start: Object.assign({}, currentPoint),
+                    end: Object.assign({}, point),
+                });
+                currentPoint = point;
+                prevControlPoint = null;
+                break;
+            }
+            case 'Z': {
+                output.push({ id, type: 'Z', params: [], start: Object.assign({}, currentPoint), end: Object.assign({}, startPoint) });
+                currentPoint = startPoint;
+                prevControlPoint = null;
+                break;
+            }
+            default:
+                throw new Error(`Unsupported command: ${type}`);
+        }
+    }
+    return output;
+}
+export function moveInAnchorCommands(acmds, opts) {
+    const cmds = [];
+    const { index, moveX, moveY } = opts;
+    acmds.forEach((acmd) => {
+        const { id, type, params } = acmd;
+        const cmd = { id, type, params: [...params] };
+        cmds.push(cmd);
+    });
+    const cmd = cmds[index];
+    const prevCmd = cmds[index - 1];
+    if (opts.type === 'start') {
+        if (!(prevCmd && cmd)) {
+            return convertPathCommandsToACLMZ(cmds);
+        }
+        if (cmd.type === 'M') {
+            cmd.params[0] += moveX;
+            cmd.params[1] += moveY;
+        }
+        if (cmd.type === 'C') {
+            cmd.params[0] += moveX;
+            cmd.params[1] += moveY;
+        }
+        switch (prevCmd.type) {
+            case 'M': {
+                prevCmd.params[0] += moveX;
+                prevCmd.params[1] += moveY;
+                break;
+            }
+            case 'L': {
+                prevCmd.params[0] += moveX;
+                prevCmd.params[1] += moveY;
+                break;
+            }
+            case 'A': {
+                prevCmd.params[5] += moveX;
+                prevCmd.params[6] += moveY;
+                break;
+            }
+            case 'C': {
+                prevCmd.params[2] += moveX;
+                prevCmd.params[3] += moveY;
+                prevCmd.params[4] += moveX;
+                prevCmd.params[5] += moveY;
+                break;
+            }
+            case 'Z': {
+                prevCmd.params[0] += moveX;
+                prevCmd.params[1] += moveY;
+                break;
+            }
+            default: {
+                break;
+            }
+        }
+    }
+    else {
+    }
+    return convertPathCommandsToACLMZ(cmds);
+}
+export function moveCurveCtrlInAnchorCommands(acmds, opts) {
+    const cmds = [];
+    const { index, type, moveX, moveY } = opts;
+    acmds.forEach((acmd) => {
+        const { id, type, params } = acmd;
+        const cmd = { id, type, params: [...params] };
+        cmds.push(cmd);
+    });
+    const cmd = cmds[index];
+    if (cmd.type === 'C') {
+        if (type === 'curve-ctrl1') {
+            cmd.params[0] += moveX;
+            cmd.params[1] += moveY;
+        }
+        else if (type === 'curve-ctrl2') {
+            cmd.params[2] += moveX;
+            cmd.params[3] += moveY;
+        }
+    }
+    return convertPathCommandsToACLMZ(cmds);
+}
+export function convertLineToExactCurveCommand(startPoint, endPoint) {
+    const endX = endPoint.x;
+    const endY = endPoint.y;
+    const cp1x = startPoint.x + (endX - startPoint.x) / 3;
+    const cp1y = startPoint.y + (endY - startPoint.y) / 3;
+    const cp2x = startPoint.x + (2 * (endX - startPoint.x)) / 3;
+    const cp2y = startPoint.y + (2 * (endY - startPoint.y)) / 3;
+    return {
+        id: createId(),
+        type: 'C',
+        params: [cp1x, cp1y, cp2x, cp2y, endX, endY],
+    };
+}

package/dist/esm/tool/svg-path.d.ts

@@ -0,0 +1,3 @@
+import type { PathCommand } from '@idraw/types';
+export declare function parseSVGPath(path: string): PathCommand[];
+export declare function convertPathCommandsToStr(commands: PathCommand[]): string;

package/dist/esm/{view → tool}/svg-path.js

@@ -7,30 +7,18 @@ export function parseSVGPath(path) {
         const params = matchParams ? matchParams.map(Number) : [];
         const command = {
             type: cmd,
-            params
+            params,
         };
         commands.push(command);
         return match;
     });
     return commands;
 }
-export function generateSVGPath(commands) {
+export function convertPathCommandsToStr(commands) {
     let path = '';
     commands.forEach((item) => {
-        path += item.type + item.params.join(' ');
+        var _a, _b;
+        path += item.type + ((_b = (_a = item.params) === null || _a === void 0 ? void 0 : _a.join) === null || _b === void 0 ? void 0 : _b.call(_a, ' '));
     });
     return path;
 }
-export function filterSVGPath(commands) {
-    const filteredCommands = [];
-    const result = {
-        x: 0,
-        y: 0,
-        h: 0,
-        w: 0,
-        detail: {
-            commands: filteredCommands
-        }
-    };
-    return result;
-}

package/dist/esm/tool/time.d.ts

@@ -1,6 +1,6 @@
 type Middleware = (ctx: any, next: Middleware) => any;
 export declare function compose(middleware: Middleware[]): (context: any, next?: Middleware) => any;
 export declare function delay(time: number): Promise<void>;
-export declare function throttle(fn: (...args: any[]) => any, timeout: number): (...args: any[]) => any;
-export declare function debounce(fn: (...args: any[]) => any, timeout: number): (...args: any[]) => any;
+export declare function throttle(fn: (...params: any[]) => any, timeout: number): (...params: any[]) => any;
+export declare function debounce(fn: (...params: any[]) => any, timeout: number): (...params: any[]) => any;
 export {};

package/dist/esm/tool/time.js

@@ -26,24 +26,24 @@ export function delay(time) {
 }
 export function throttle(fn, timeout) {
     let timer = -1;
-    return function (...args) {
+    return function (...params) {
         if (timer >= 0) {
             return;
         }
         timer = setTimeout(() => {
-            fn(...args);
+            fn(...params);
             timer = -1;
         }, timeout);
     };
 }
 export function debounce(fn, timeout) {
     let timer = -1;
-    return function (...args) {
+    return function (...params) {
         if (timer >= 0) {
             window.clearTimeout(timer);
         }
         timer = setTimeout(() => {
-            fn(...args);
+            fn(...params);
             timer = -1;
         }, timeout);
     };

package/dist/esm/tool/uuid.d.ts

@@ -1,3 +1,3 @@
 export declare function createUUID(): string;
-export declare function createAssetId(assetStr: string, elemUUID: string): string;
+export declare function createAssetId(assetStr: string, mtrlUUID: string): string;
 export declare function isAssetId(id: any | string): boolean;

package/dist/esm/tool/uuid.js

@@ -1,8 +1,8 @@
+function createStr(num) {
+    return (((1 + Math.random()) * 0x10000) | 0).toString(num || 16).substring(1);
+}
 export function createUUID() {
-    function _createStr() {
-        return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
-    }
-    return `${_createStr()}${_createStr()}-${_createStr()}-${_createStr()}-${_createStr()}-${_createStr()}${_createStr()}${_createStr()}`;
+    return `${createStr()}${createStr()}-${createStr()}-${createStr()}-${createStr()}-${createStr()}${createStr()}${createStr()}`;
 }
 function limitHexStr(str, seed) {
     let count = 0;
@@ -18,9 +18,9 @@ function sumCharCodes(str) {
     }
     return sum;
 }
-export function createAssetId(assetStr, elemUUID) {
+export function createAssetId(assetStr, mtrlUUID) {
     const len = assetStr.length;
-    const seed = sumCharCodes(elemUUID);
+    const seed = sumCharCodes(mtrlUUID);
     const mid = Math.floor(len / 2);
     const start4 = assetStr.substring(0, 4).padStart(4, '0');
     const end4 = assetStr.substring(0, 4).padStart(4, '0');

package/dist/esm/view/box.d.ts

@@ -1,2 +0,0 @@
-import type { BoxInfo, Element } from '@idraw/types';
-export declare function elementToBoxInfo(elem: Element): BoxInfo;