@idraw/core 0.3.1 → 0.4.0-alpha.2

package/dist/esm/lib/helper.js

@@ -1,363 +0,0 @@
-import { deepClone } from '@idraw/util';
-import { parseAngleToRadian, calcElementCenter } from './calculate';
-import { rotateContext, rotateElement } from './transform';
-import { LIMIT_QBLIQUE_ANGLE } from './../constant/element';
-const limitQbliqueAngle = LIMIT_QBLIQUE_ANGLE;
-export class Helper {
-    constructor(board, config) {
-        this._areaStart = { x: 0, y: 0 };
-        this._areaEnd = { x: 0, y: 0 };
-        this._board = board;
-        this._ctx = this._board.getContext();
-        this._coreConfig = config;
-        this._helperConfig = {
-            elementIndexMap: {}
-        };
-    }
-    updateConfig(data, opts) {
-        this._updateElementIndex(data);
-        this._updateSelectedElementWrapper(data, opts);
-        this._updateSelectedElementListWrapper(data, opts);
-    }
-    getConfig() {
-        return deepClone(this._helperConfig);
-    }
-    getElementIndexByUUID(uuid) {
-        const index = this._helperConfig.elementIndexMap[uuid];
-        if (index >= 0) {
-            return index;
-        }
-        return null;
-    }
-    isPointInElementWrapperController(p, data) {
-        var _a, _b;
-        const ctx = this._ctx;
-        const uuid = ((_b = (_a = this._helperConfig) === null || _a === void 0 ? void 0 : _a.selectedElementWrapper) === null || _b === void 0 ? void 0 : _b.uuid) || null;
-        let directIndex = null;
-        let selectedControllerDirection = null;
-        let hoverControllerDirection = null;
-        if (!this._helperConfig.selectedElementWrapper) {
-            return {
-                uuid,
-                selectedControllerDirection,
-                directIndex,
-                hoverControllerDirection
-            };
-        }
-        const wrapper = this._helperConfig.selectedElementWrapper;
-        const controllers = [
-            wrapper.controllers.right,
-            wrapper.controllers.topRight,
-            wrapper.controllers.top,
-            wrapper.controllers.topLeft,
-            wrapper.controllers.left,
-            wrapper.controllers.bottomLeft,
-            wrapper.controllers.bottom,
-            wrapper.controllers.bottomRight
-        ];
-        const directionNames = [
-            'right',
-            'top-right',
-            'top',
-            'top-left',
-            'left',
-            'bottom-left',
-            'bottom',
-            'bottom-right'
-        ];
-        let hoverDirectionNames = deepClone(directionNames);
-        let angleMoveNum = 0;
-        if (data && uuid) {
-            const elemIdx = this.getElementIndexByUUID(uuid);
-            if (elemIdx !== null && elemIdx >= 0) {
-                const elem = data.elements[elemIdx];
-                let angle = elem.angle || 0;
-                if (angle < 0) {
-                    angle += 360;
-                }
-                if (angle < 45) {
-                    angleMoveNum = 0;
-                }
-                else if (angle < 90) {
-                    angleMoveNum = 1;
-                }
-                else if (angle < 135) {
-                    angleMoveNum = 2;
-                }
-                else if (angle < 180) {
-                    angleMoveNum = 3;
-                }
-                else if (angle < 225) {
-                    angleMoveNum = 4;
-                }
-                else if (angle < 270) {
-                    angleMoveNum = 5;
-                }
-                else if (angle < 315) {
-                    angleMoveNum = 6;
-                }
-            }
-        }
-        if (angleMoveNum > 0) {
-            hoverDirectionNames = hoverDirectionNames
-                .slice(-angleMoveNum)
-                .concat(hoverDirectionNames.slice(0, -angleMoveNum));
-        }
-        rotateContext(ctx, wrapper.translate, wrapper.radian || 0, () => {
-            for (let i = 0; i < controllers.length; i++) {
-                const controller = controllers[i];
-                if (controller.invisible === true) {
-                    continue;
-                }
-                ctx.beginPath();
-                ctx.arc(controller.x, controller.y, wrapper.controllerSize, 0, Math.PI * 2);
-                ctx.closePath();
-                if (ctx.isPointInPath(p.x, p.y)) {
-                    selectedControllerDirection = directionNames[i];
-                    hoverControllerDirection = hoverDirectionNames[i];
-                }
-                if (selectedControllerDirection) {
-                    directIndex = i;
-                    break;
-                }
-            }
-        });
-        if (selectedControllerDirection === null) {
-            const controller = wrapper.controllers.rotate;
-            if (controller.invisible !== true) {
-                rotateContext(ctx, wrapper.translate, wrapper.radian || 0, () => {
-                    ctx.beginPath();
-                    ctx.arc(controller.x, controller.y, wrapper.controllerSize, 0, Math.PI * 2);
-                    ctx.closePath();
-                    if (ctx.isPointInPath(p.x, p.y)) {
-                        selectedControllerDirection = 'rotate';
-                        hoverControllerDirection = 'rotate';
-                    }
-                });
-            }
-        }
-        return {
-            uuid,
-            selectedControllerDirection,
-            hoverControllerDirection,
-            directIndex
-        };
-    }
-    isPointInElementList(p, data) {
-        var _a, _b, _c;
-        const ctx = this._ctx;
-        let idx = -1;
-        let uuid = null;
-        const wrapperList = ((_a = this._helperConfig) === null || _a === void 0 ? void 0 : _a.selectedElementListWrappers) || [];
-        for (let i = 0; i < wrapperList.length; i++) {
-            const wrapper = wrapperList[i];
-            const elemIdx = this._helperConfig.elementIndexMap[wrapper.uuid];
-            const ele = data.elements[elemIdx];
-            if (!ele)
-                continue;
-            if (((_b = ele.operation) === null || _b === void 0 ? void 0 : _b.invisible) === true)
-                continue;
-            let bw = 0;
-            if (((_c = ele.desc) === null || _c === void 0 ? void 0 : _c.borderWidth) > 0) {
-                bw = ele.desc.borderWidth;
-            }
-            rotateElement(ctx, ele, () => {
-                ctx.beginPath();
-                ctx.moveTo(ele.x - bw, ele.y - bw);
-                ctx.lineTo(ele.x + ele.w + bw, ele.y - bw);
-                ctx.lineTo(ele.x + ele.w + bw, ele.y + ele.h + bw);
-                ctx.lineTo(ele.x - bw, ele.y + ele.h + bw);
-                ctx.lineTo(ele.x - bw, ele.y - bw);
-                ctx.closePath();
-                if (ctx.isPointInPath(p.x, p.y)) {
-                    idx = i;
-                    uuid = ele.uuid;
-                }
-            });
-            if (idx >= 0) {
-                break;
-            }
-        }
-        if (uuid && idx >= 0) {
-            return true;
-        }
-        else {
-            return false;
-        }
-    }
-    startSelectArea(p) {
-        this._areaStart = p;
-        this._areaEnd = p;
-    }
-    changeSelectArea(p) {
-        this._areaEnd = p;
-        this._calcSelectedArea();
-    }
-    clearSelectedArea() {
-        this._areaStart = { x: 0, y: 0 };
-        this._areaEnd = { x: 0, y: 0 };
-        this._calcSelectedArea();
-    }
-    calcSelectedElements(data) {
-        const transform = this._ctx.getTransform();
-        const { scale = 1, scrollX = 0, scrollY = 0 } = transform;
-        const start = this._areaStart;
-        const end = this._areaEnd;
-        const x = (Math.min(start.x, end.x) - scrollX) / scale;
-        const y = (Math.min(start.y, end.y) - scrollY) / scale;
-        const w = Math.abs(end.x - start.x) / scale;
-        const h = Math.abs(end.y - start.y) / scale;
-        const uuids = [];
-        const ctx = this._ctx;
-        ctx.beginPath();
-        ctx.moveTo(x, y);
-        ctx.lineTo(x + w, y);
-        ctx.lineTo(x + w, y + h);
-        ctx.lineTo(x, y + h);
-        ctx.lineTo(x, y);
-        ctx.closePath();
-        data.elements.forEach((elem) => {
-            var _a;
-            if (((_a = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _a === void 0 ? void 0 : _a.invisible) !== true) {
-                const centerX = elem.x + elem.w / 2;
-                const centerY = elem.y + elem.h / 2;
-                if (ctx.isPointInPathWithoutScroll(centerX, centerY)) {
-                    uuids.push(elem.uuid);
-                }
-            }
-        });
-        return uuids;
-    }
-    _calcSelectedArea() {
-        const start = this._areaStart;
-        const end = this._areaEnd;
-        const transform = this._ctx.getTransform();
-        const { scale = 1, scrollX = 0, scrollY = 0 } = transform;
-        const elemWrapper = this._coreConfig.elementWrapper;
-        const lineWidth = elemWrapper.lineWidth / scale;
-        const lineDash = elemWrapper.lineDash.map((n) => n / scale);
-        this._helperConfig.selectedAreaWrapper = {
-            x: (Math.min(start.x, end.x) - scrollX) / scale,
-            y: (Math.min(start.y, end.y) - scrollY) / scale,
-            w: Math.abs(end.x - start.x) / scale,
-            h: Math.abs(end.y - start.y) / scale,
-            startPoint: { x: start.x, y: start.y },
-            endPoint: { x: end.x, y: end.y },
-            lineWidth: lineWidth,
-            lineDash: lineDash,
-            color: elemWrapper.color
-        };
-    }
-    _updateElementIndex(data) {
-        this._helperConfig.elementIndexMap = {};
-        data.elements.forEach((elem, i) => {
-            this._helperConfig.elementIndexMap[elem.uuid] = i;
-        });
-    }
-    _updateSelectedElementWrapper(data, opts) {
-        var _a;
-        const { selectedUUID: uuid } = opts;
-        if (!(typeof uuid === 'string' &&
-            this._helperConfig.elementIndexMap[uuid] >= 0)) {
-            delete this._helperConfig.selectedElementWrapper;
-            return;
-        }
-        const index = this._helperConfig.elementIndexMap[uuid];
-        const elem = data.elements[index];
-        if (((_a = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _a === void 0 ? void 0 : _a.invisible) === true) {
-            return;
-        }
-        const wrapper = this._createSelectedElementWrapper(elem, opts);
-        this._helperConfig.selectedElementWrapper = wrapper;
-    }
-    _updateSelectedElementListWrapper(data, opts) {
-        const { selectedUUIDList } = opts;
-        const wrapperList = [];
-        data.elements.forEach((elem) => {
-            if (selectedUUIDList === null || selectedUUIDList === void 0 ? void 0 : selectedUUIDList.includes(elem.uuid)) {
-                const wrapper = this._createSelectedElementWrapper(elem, opts);
-                wrapperList.push(wrapper);
-            }
-        });
-        this._helperConfig.selectedElementListWrappers = wrapperList;
-    }
-    _createSelectedElementWrapper(elem, opts) {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
-        const { scale } = opts;
-        const elemWrapper = this._coreConfig.elementWrapper;
-        const controllerSize = elemWrapper.controllerSize / scale;
-        const lineWidth = elemWrapper.lineWidth / scale;
-        const lineDash = elemWrapper.lineDash.map((n) => n / scale);
-        const rotateLimit = 12;
-        const bw = ((_a = elem.desc) === null || _a === void 0 ? void 0 : _a.borderWidth) || 0;
-        let hideObliqueDirection = false;
-        if (typeof elem.angle === 'number' &&
-            Math.abs(elem.angle) > limitQbliqueAngle) {
-            hideObliqueDirection = true;
-        }
-        const controllerOffset = lineWidth;
-        const wrapper = {
-            uuid: elem.uuid,
-            controllerSize: controllerSize,
-            controllerOffset: controllerOffset,
-            lock: ((_b = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _b === void 0 ? void 0 : _b.lock) === true,
-            controllers: {
-                topLeft: {
-                    x: elem.x - controllerOffset - bw,
-                    y: elem.y - controllerOffset - bw,
-                    invisible: hideObliqueDirection || ((_c = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _c === void 0 ? void 0 : _c.disableScale) === true
-                },
-                top: {
-                    x: elem.x + elem.w / 2,
-                    y: elem.y - controllerOffset - bw,
-                    invisible: ((_d = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _d === void 0 ? void 0 : _d.disableScale) === true
-                },
-                topRight: {
-                    x: elem.x + elem.w + controllerOffset + bw,
-                    y: elem.y - controllerOffset - bw,
-                    invisible: hideObliqueDirection || ((_e = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _e === void 0 ? void 0 : _e.disableScale) === true
-                },
-                right: {
-                    x: elem.x + elem.w + controllerOffset + bw,
-                    y: elem.y + elem.h / 2,
-                    invisible: ((_f = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _f === void 0 ? void 0 : _f.disableScale) === true
-                },
-                bottomRight: {
-                    x: elem.x + elem.w + controllerOffset + bw,
-                    y: elem.y + elem.h + controllerOffset + bw,
-                    invisible: hideObliqueDirection || ((_g = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _g === void 0 ? void 0 : _g.disableScale) === true
-                },
-                bottom: {
-                    x: elem.x + elem.w / 2,
-                    y: elem.y + elem.h + controllerOffset + bw,
-                    invisible: ((_h = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _h === void 0 ? void 0 : _h.disableScale) === true
-                },
-                bottomLeft: {
-                    x: elem.x - controllerOffset - bw,
-                    y: elem.y + elem.h + controllerOffset + bw,
-                    invisible: hideObliqueDirection || ((_j = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _j === void 0 ? void 0 : _j.disableScale) === true
-                },
-                left: {
-                    x: elem.x - controllerOffset - bw,
-                    y: elem.y + elem.h / 2,
-                    invisible: ((_k = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _k === void 0 ? void 0 : _k.disableScale) === true
-                },
-                rotate: {
-                    x: elem.x + elem.w / 2,
-                    y: elem.y - controllerSize - (controllerSize * 2 + rotateLimit) - bw,
-                    invisible: ((_l = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _l === void 0 ? void 0 : _l.disableRotate) === true
-                }
-            },
-            lineWidth: lineWidth,
-            lineDash: lineDash,
-            color: ((_m = elem === null || elem === void 0 ? void 0 : elem.operation) === null || _m === void 0 ? void 0 : _m.lock) === true
-                ? elemWrapper.lockColor
-                : elemWrapper.color
-        };
-        if (typeof elem.angle === 'number' && (elem.angle > 0 || elem.angle < 0)) {
-            wrapper.radian = parseAngleToRadian(elem.angle);
-            wrapper.translate = calcElementCenter(elem);
-        }
-        return wrapper;
-    }
-}

package/dist/esm/lib/index.d.ts

@@ -1,13 +0,0 @@
-export * from './calculate';
-export * from './check';
-export * from './config';
-export * from './core-event';
-export * from './diff';
-export * from './element';
-export * from './helper';
-export * from './is';
-export * from './mapper';
-export * from './parse';
-export * from './temp';
-export * from './transform';
-export * from './value';

package/dist/esm/lib/index.js

@@ -1,13 +0,0 @@
-export * from './calculate';
-export * from './check';
-export * from './config';
-export * from './core-event';
-export * from './diff';
-export * from './element';
-export * from './helper';
-export * from './is';
-export * from './mapper';
-export * from './parse';
-export * from './temp';
-export * from './transform';
-export * from './value';

package/dist/esm/lib/is.d.ts

@@ -1,26 +0,0 @@
-declare const is: IsTypeUtil;
-type IsTypeUtil = {
-    x: (value: any) => boolean;
-    y: (value: any) => boolean;
-    w: (value: any) => boolean;
-    h: (value: any) => boolean;
-    angle: (value: any) => boolean;
-    number: (value: any) => boolean;
-    borderWidth: (value: any) => boolean;
-    borderRadius: (value: any) => boolean;
-    color: (value: any) => boolean;
-    imageSrc: (value: any) => boolean;
-    imageURL: (value: any) => boolean;
-    imageBase64: (value: any) => boolean;
-    svg: (value: any) => boolean;
-    html: (value: any) => boolean;
-    text: (value: any) => boolean;
-    fontSize: (value: any) => boolean;
-    fontWeight: (value: any) => boolean;
-    lineHeight: (value: any) => boolean;
-    textAlign: (value: any) => boolean;
-    fontFamily: (value: any) => boolean;
-    strokeWidth: (value: any) => boolean;
-};
-export default is;
-export { IsTypeUtil };

package/dist/esm/lib/is.js

@@ -1,100 +0,0 @@
-import { isColorStr } from '@idraw/util';
-function number(value) {
-    return typeof value === 'number' && (value > 0 || value <= 0);
-}
-function x(value) {
-    return number(value);
-}
-function y(value) {
-    return number(value);
-}
-function w(value) {
-    return typeof value === 'number' && value >= 0;
-}
-function h(value) {
-    return typeof value === 'number' && value >= 0;
-}
-function angle(value) {
-    return typeof value === 'number' && value >= -360 && value <= 360;
-}
-function borderWidth(value) {
-    return w(value);
-}
-function borderRadius(value) {
-    return number(value) && value >= 0;
-}
-function color(value) {
-    return isColorStr(value);
-}
-function imageURL(value) {
-    return (typeof value === 'string' &&
-        /^(http:\/\/|https:\/\/|\.\/|\/)/.test(`${value}`));
-}
-function imageBase64(value) {
-    return typeof value === 'string' && /^(data:image\/)/.test(`${value}`);
-}
-function imageSrc(value) {
-    return imageBase64(value) || imageURL(value);
-}
-function svg(value) {
-    return (typeof value === 'string' &&
-        /^(<svg[\s]{1,}|<svg>)/i.test(`${value}`.trim()) &&
-        /<\/[\s]{0,}svg>$/i.test(`${value}`.trim()));
-}
-function html(value) {
-    let result = false;
-    if (typeof value === 'string') {
-        let div = document.createElement('div');
-        div.innerHTML = value;
-        if (div.children.length > 0) {
-            result = true;
-        }
-        div = null;
-    }
-    return result;
-}
-function text(value) {
-    return typeof value === 'string';
-}
-function fontSize(value) {
-    return number(value) && value > 0;
-}
-function lineHeight(value) {
-    return number(value) && value > 0;
-}
-function strokeWidth(value) {
-    return number(value) && value > 0;
-}
-function textAlign(value) {
-    return ['center', 'left', 'right'].includes(value);
-}
-function fontFamily(value) {
-    return typeof value === 'string' && value.length > 0;
-}
-function fontWeight(value) {
-    return ['bold'].includes(value);
-}
-const is = {
-    x,
-    y,
-    w,
-    h,
-    angle,
-    number,
-    borderWidth,
-    borderRadius,
-    color,
-    imageSrc,
-    imageURL,
-    imageBase64,
-    svg,
-    html,
-    text,
-    fontSize,
-    lineHeight,
-    textAlign,
-    fontFamily,
-    fontWeight,
-    strokeWidth
-};
-export default is;

package/dist/esm/lib/mapper.d.ts

@@ -1,26 +0,0 @@
-import { IDrawData, Point, PointCursor } from '@idraw/types';
-import Board from '@idraw/board';
-import { Helper } from './helper';
-import { Element } from './element';
-declare const _board: unique symbol;
-declare const _helper: unique symbol;
-declare const _element: unique symbol;
-declare const _opts: unique symbol;
-type Options = {
-    board: Board;
-    element: Element;
-    helper: Helper;
-};
-export declare class Mapper {
-    private [_opts];
-    private [_board];
-    private [_helper];
-    private [_element];
-    constructor(opts: Options);
-    isEffectivePoint(p: Point): boolean;
-    judgePointCursor(p: Point, data: IDrawData): {
-        cursor: PointCursor;
-        elementUUID: string | null;
-    };
-}
-export {};

package/dist/esm/lib/mapper.js

@@ -1,89 +0,0 @@
-const _board = Symbol('_displayCtx');
-const _helper = Symbol('_helper');
-const _element = Symbol('_element');
-const _opts = Symbol('_opts');
-export class Mapper {
-    constructor(opts) {
-        this[_opts] = opts;
-        this[_board] = this[_opts].board;
-        this[_element] = this[_opts].element;
-        this[_helper] = this[_opts].helper;
-    }
-    isEffectivePoint(p) {
-        const scrollLineWidth = this[_board].getScrollLineWidth();
-        const screenInfo = this[_board].getScreenInfo();
-        if (p.x <= screenInfo.width - scrollLineWidth &&
-            p.y <= screenInfo.height - scrollLineWidth) {
-            return true;
-        }
-        return false;
-    }
-    judgePointCursor(p, data) {
-        let cursor = 'auto';
-        let elementUUID = null;
-        if (!this.isEffectivePoint(p)) {
-            return { cursor, elementUUID };
-        }
-        const { uuid, hoverControllerDirection } = this[_helper].isPointInElementWrapperController(p, data);
-        const direction = hoverControllerDirection;
-        if (uuid && direction) {
-            switch (direction) {
-                case 'top-right': {
-                    cursor = 'ne-resize';
-                    break;
-                }
-                case 'top-left': {
-                    cursor = 'nw-resize';
-                    break;
-                }
-                case 'top': {
-                    cursor = 'n-resize';
-                    break;
-                }
-                case 'right': {
-                    cursor = 'e-resize';
-                    break;
-                }
-                case 'bottom-right': {
-                    cursor = 'se-resize';
-                    break;
-                }
-                case 'bottom': {
-                    cursor = 's-resize';
-                    break;
-                }
-                case 'bottom-left': {
-                    cursor = 'sw-resize';
-                    break;
-                }
-                case 'left': {
-                    cursor = 'w-resize';
-                    break;
-                }
-                case 'rotate': {
-                    cursor = 'grab';
-                    break;
-                }
-                default: {
-                    break;
-                }
-            }
-            if (uuid) {
-                elementUUID = uuid;
-            }
-        }
-        else {
-            const [index, uuid] = this[_element].isPointInElement(p, data);
-            if (index >= 0) {
-                cursor = 'move';
-            }
-            if (uuid) {
-                elementUUID = uuid;
-            }
-        }
-        return {
-            cursor,
-            elementUUID
-        };
-    }
-}

package/dist/esm/lib/parse.d.ts

@@ -1,2 +0,0 @@
-import { IDrawData } from '@idraw/types';
-export declare function parseData(data: any): IDrawData;

package/dist/esm/lib/parse.js

@@ -1,32 +0,0 @@
-import { elementNames } from './../constant/element';
-export function parseData(data) {
-    const result = {
-        elements: []
-    };
-    if (Array.isArray(data === null || data === void 0 ? void 0 : data.elements)) {
-        data === null || data === void 0 ? void 0 : data.elements.forEach((elem = {}) => {
-            if (isElement(elem)) {
-                result.elements.push(elem);
-            }
-        });
-    }
-    if (typeof data.bgColor === 'string') {
-        result.bgColor = data.bgColor;
-    }
-    return result;
-}
-function isElement(elem) {
-    if (!(isNumber(elem.x) &&
-        isNumber(elem.y) &&
-        isNumber(elem.w) &&
-        isNumber(elem.h))) {
-        return false;
-    }
-    if (!(typeof elem.type === 'string' && elementNames.includes(elem.type))) {
-        return false;
-    }
-    return true;
-}
-function isNumber(num) {
-    return num >= 0 || num < 0;
-}

package/dist/esm/lib/temp.d.ts

@@ -1,11 +0,0 @@
-type TempDataDesc = {
-    hasInited: boolean;
-};
-export declare class TempData {
-    private _temp;
-    constructor();
-    set<T extends keyof TempDataDesc>(name: T, value: TempDataDesc[T]): void;
-    get<T extends keyof TempDataDesc>(name: T): TempDataDesc[T];
-    clear(): void;
-}
-export {};