@meta2d/core 1.0.0

package/src/canvas/canvasImage.js

@@ -0,0 +1,343 @@
+var __values = (this && this.__values) || function(o) {
+    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
+    if (m) return m.call(o);
+    if (o && typeof o.length === "number") return {
+        next: function () {
+            if (o && i >= o.length) o = void 0;
+            return { value: o && o[i++], done: !o };
+        }
+    };
+    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
+};
+import { ctxFlip, ctxRotate, drawImage, setGlobalAlpha } from '../pen';
+import { rgba } from '../utils';
+import { createOffscreen } from './offscreen';
+var CanvasImage = /** @class */ (function () {
+    function CanvasImage(parentElement, store, isBottom) {
+        this.parentElement = parentElement;
+        this.store = store;
+        this.isBottom = isBottom;
+        this.canvas = document.createElement('canvas');
+        /**
+         * 非图片的绘制
+         * isBottom true 指背景颜色，背景网格
+         * isBottom false 指 标尺
+         */
+        this.otherOffsreen = createOffscreen(); // 非图片的
+        this.offscreen = createOffscreen();
+        this.animateOffsScreen = createOffscreen();
+        parentElement.appendChild(this.canvas);
+        this.canvas.style.backgroundRepeat = 'no-repeat';
+        this.canvas.style.backgroundSize = '100% 100%';
+        this.canvas.style.position = 'absolute';
+        this.canvas.style.top = '0';
+        this.canvas.style.left = '0';
+    }
+    CanvasImage.prototype.resize = function (w, h) {
+        this.canvas.style.width = w + 'px';
+        this.canvas.style.height = h + 'px';
+        w = (w * this.store.dpiRatio) | 0;
+        h = (h * this.store.dpiRatio) | 0;
+        this.canvas.width = w;
+        this.canvas.height = h;
+        this.otherOffsreen.width = w;
+        this.otherOffsreen.height = h;
+        this.offscreen.width = w;
+        this.offscreen.height = h;
+        this.animateOffsScreen.width = w;
+        this.animateOffsScreen.height = h;
+        this.otherOffsreen
+            .getContext('2d')
+            .scale(this.store.dpiRatio, this.store.dpiRatio);
+        this.otherOffsreen.getContext('2d').textBaseline = 'middle';
+        this.offscreen
+            .getContext('2d')
+            .scale(this.store.dpiRatio, this.store.dpiRatio);
+        this.offscreen.getContext('2d').textBaseline = 'middle';
+        this.animateOffsScreen
+            .getContext('2d')
+            .scale(this.store.dpiRatio, this.store.dpiRatio);
+        this.animateOffsScreen.getContext('2d').textBaseline = 'middle';
+        this.init();
+    };
+    CanvasImage.prototype.init = function () {
+        var e_1, _a;
+        this.offscreen
+            .getContext('2d')
+            .clearRect(0, 0, this.canvas.width, this.canvas.height);
+        this.animateOffsScreen
+            .getContext('2d')
+            .clearRect(0, 0, this.canvas.width, this.canvas.height);
+        try {
+            for (var _b = __values(this.store.data.pens), _c = _b.next(); !_c.done; _c = _b.next()) {
+                var pen = _c.value;
+                if (this.hasImage(pen)) {
+                    // 只影响本层的
+                    pen.calculative.imageDrawed = false;
+                }
+            }
+        }
+        catch (e_1_1) { e_1 = { error: e_1_1 }; }
+        finally {
+            try {
+                if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+            }
+            finally { if (e_1) throw e_1.error; }
+        }
+        this.store.patchFlagsBackground = true;
+        this.store.patchFlagsTop = true;
+    };
+    CanvasImage.prototype.clear = function () {
+        this.otherOffsreen
+            .getContext('2d')
+            .clearRect(0, 0, this.otherOffsreen.width, this.otherOffsreen.height);
+        this.offscreen
+            .getContext('2d')
+            .clearRect(0, 0, this.canvas.width, this.canvas.height);
+        this.animateOffsScreen
+            .getContext('2d')
+            .clearRect(0, 0, this.canvas.width, this.canvas.height);
+        this.canvas
+            .getContext('2d')
+            .clearRect(0, 0, this.canvas.width, this.canvas.height);
+    };
+    CanvasImage.prototype.hasImage = function (pen) {
+        pen.calculative.hasImage =
+            pen.calculative &&
+                pen.calculative.inView &&
+                !pen.isBottom == !this.isBottom && // undefined == false 结果 false
+                pen.image &&
+                pen.calculative.img &&
+                pen.name !== 'gif';
+        return pen.calculative.hasImage;
+    };
+    CanvasImage.prototype.render = function () {
+        var e_2, _a, e_3, _b, e_4, _c;
+        var patchFlags = false;
+        var patchFlagsAnimate = false;
+        try {
+            for (var _d = __values(this.store.data.pens), _e = _d.next(); !_e.done; _e = _d.next()) {
+                var pen = _e.value;
+                if (this.hasImage(pen)) {
+                    if (this.store.animates.has(pen)) {
+                        patchFlagsAnimate = true;
+                    }
+                    else if (!pen.calculative.imageDrawed) {
+                        patchFlags = true;
+                    }
+                }
+            }
+        }
+        catch (e_2_1) { e_2 = { error: e_2_1 }; }
+        finally {
+            try {
+                if (_e && !_e.done && (_a = _d.return)) _a.call(_d);
+            }
+            finally { if (e_2) throw e_2.error; }
+        }
+        var patchFlagsBackground = this.store.patchFlagsBackground;
+        if (patchFlagsBackground && this.isBottom) {
+            var ctx = this.otherOffsreen.getContext('2d');
+            ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
+            var background = this.store.data.background || this.store.options.background;
+            if (background) {
+                ctx.save();
+                ctx.fillStyle = background;
+                ctx.fillRect(0, 0, this.canvas.width, this.canvas.height);
+                ctx.restore();
+            }
+            this.renderGrid(ctx);
+        }
+        var patchFlagsTop = this.store.patchFlagsTop;
+        if (patchFlagsTop && !this.isBottom) {
+            var ctx = this.otherOffsreen.getContext('2d');
+            ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
+            this.renderRule(ctx);
+        }
+        if (patchFlags) {
+            var ctx = this.offscreen.getContext('2d');
+            ctx.save();
+            ctx.translate(this.store.data.x, this.store.data.y);
+            try {
+                for (var _f = __values(this.store.data.pens), _g = _f.next(); !_g.done; _g = _f.next()) {
+                    var pen = _g.value;
+                    if (!pen.calculative.hasImage ||
+                        pen.calculative.imageDrawed ||
+                        this.store.animates.has(pen)) {
+                        continue;
+                    }
+                    pen.calculative.imageDrawed = true;
+                    ctx.save();
+                    ctxFlip(ctx, pen);
+                    if (pen.calculative.rotate) {
+                        ctxRotate(ctx, pen);
+                    }
+                    setGlobalAlpha(ctx, pen);
+                    drawImage(ctx, pen);
+                    ctx.restore();
+                }
+            }
+            catch (e_3_1) { e_3 = { error: e_3_1 }; }
+            finally {
+                try {
+                    if (_g && !_g.done && (_b = _f.return)) _b.call(_f);
+                }
+                finally { if (e_3) throw e_3.error; }
+            }
+            ctx.restore();
+        }
+        if (patchFlagsAnimate) {
+            var ctx = this.animateOffsScreen.getContext('2d');
+            ctx.save();
+            ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
+            ctx.translate(this.store.data.x, this.store.data.y);
+            try {
+                for (var _h = __values(this.store.animates), _j = _h.next(); !_j.done; _j = _h.next()) {
+                    var pen = _j.value;
+                    if (!pen.calculative.hasImage) {
+                        continue;
+                    }
+                    pen.calculative.imageDrawed = true;
+                    ctx.save();
+                    ctxFlip(ctx, pen);
+                    if (pen.calculative.rotate) {
+                        ctxRotate(ctx, pen);
+                    }
+                    setGlobalAlpha(ctx, pen);
+                    drawImage(ctx, pen);
+                    ctx.restore();
+                }
+            }
+            catch (e_4_1) { e_4 = { error: e_4_1 }; }
+            finally {
+                try {
+                    if (_j && !_j.done && (_c = _h.return)) _c.call(_h);
+                }
+                finally { if (e_4) throw e_4.error; }
+            }
+            ctx.restore();
+        }
+        if (patchFlags ||
+            patchFlagsAnimate ||
+            (patchFlagsBackground && this.isBottom) ||
+            (patchFlagsTop && !this.isBottom)) {
+            var ctxCanvas = this.canvas.getContext('2d');
+            ctxCanvas.clearRect(0, 0, this.canvas.width, this.canvas.height);
+            if (this.isBottom) {
+                ctxCanvas.drawImage(this.otherOffsreen, 0, 0, this.canvas.width, this.canvas.height);
+                this.store.patchFlagsBackground = false;
+            }
+            ctxCanvas.drawImage(this.offscreen, 0, 0, this.canvas.width, this.canvas.height);
+            ctxCanvas.drawImage(this.animateOffsScreen, 0, 0, this.canvas.width, this.canvas.height);
+            if (!this.isBottom) {
+                ctxCanvas.drawImage(this.otherOffsreen, 0, 0, this.canvas.width, this.canvas.height);
+                this.store.patchFlagsTop = false;
+            }
+        }
+    };
+    CanvasImage.prototype.renderGrid = function (ctx) {
+        var _a = this.store, data = _a.data, options = _a.options;
+        var grid = data.grid, gridRotate = data.gridRotate, gridColor = data.gridColor, gridSize = data.gridSize, scale = data.scale;
+        if (!(grid !== null && grid !== void 0 ? grid : options.grid)) {
+            // grid false 时不绘制, undefined 时看 options.grid
+            return;
+        }
+        ctx.save();
+        var _b = this.canvas, width = _b.width, height = _b.height;
+        if (gridRotate) {
+            ctx.translate(width / 2, height / 2);
+            ctx.rotate((gridRotate * Math.PI) / 180);
+            ctx.translate(-width / 2, -height / 2);
+        }
+        ctx.lineWidth = 1;
+        ctx.strokeStyle = gridColor || options.gridColor;
+        ctx.beginPath();
+        var size = (gridSize || options.gridSize) * scale;
+        var longSide = Math.max(width, height);
+        var count = Math.ceil(longSide / size);
+        for (var i = -size * count; i < longSide * 2; i += size) {
+            ctx.moveTo(i, -longSide);
+            ctx.lineTo(i, longSide * 2);
+        }
+        for (var i = -size * count; i < longSide * 2; i += size) {
+            ctx.moveTo(-longSide, i);
+            ctx.lineTo(longSide * 2, i);
+        }
+        ctx.stroke();
+        ctx.restore();
+    };
+    CanvasImage.prototype.renderRule = function (ctx) {
+        var _a = this.store, data = _a.data, options = _a.options;
+        var rule = data.rule, ruleColor = data.ruleColor, scale = data.scale, origin = data.origin;
+        if (!(rule !== null && rule !== void 0 ? rule : options.rule)) {
+            // rule false 时不绘制, undefined 时看 options.rule
+            return;
+        }
+        var span = scale * 10;
+        ctx.save();
+        var finalRuleColor = ruleColor || options.ruleColor;
+        ctx.strokeStyle = rgba(finalRuleColor, 0.7);
+        var x = origin.x + data.x;
+        var y = origin.y + data.y;
+        var _b = this.canvas, width = _b.width, height = _b.height;
+        // horizontal rule
+        ctx.beginPath();
+        ctx.lineWidth = 12;
+        ctx.lineDashOffset = -x % span;
+        ctx.setLineDash([1, span - 1]);
+        ctx.moveTo(0, 0);
+        ctx.lineTo(width, 0);
+        ctx.stroke();
+        // vertical rule
+        ctx.beginPath();
+        ctx.lineDashOffset = -y % span;
+        ctx.moveTo(0, 0);
+        ctx.lineTo(0, height);
+        ctx.stroke();
+        // the big rule
+        ctx.strokeStyle = finalRuleColor;
+        ctx.beginPath();
+        ctx.lineWidth = 24;
+        ctx.lineDashOffset = -x % (span * 10);
+        ctx.setLineDash([1, span * 10 - 1]);
+        ctx.moveTo(0, 0);
+        ctx.lineTo(width, 0);
+        ctx.stroke();
+        ctx.beginPath();
+        ctx.lineDashOffset = -y % (span * 10);
+        ctx.moveTo(0, 0);
+        ctx.lineTo(0, height);
+        ctx.stroke();
+        ctx.beginPath();
+        ctx.fillStyle = ctx.strokeStyle;
+        var text = 0 - Math.floor(x / span / 10) * 100;
+        if (x < 0) {
+            text -= 100;
+        }
+        for (var i = x % (span * 10); i < width; i += 10 * span, text += 100) {
+            if (span < 3 && text % 500) {
+                continue;
+            }
+            ctx.fillText(text.toString(), i + 4, 16);
+        }
+        text = 0 - Math.floor(y / span / 10) * 100;
+        if (y < 0) {
+            text -= 100;
+        }
+        for (var i = y % (span * 10); i < height; i += 10 * span, text += 100) {
+            if (span < 3 && text % 500) {
+                continue;
+            }
+            ctx.save();
+            ctx.beginPath();
+            ctx.translate(16, i - 4);
+            ctx.rotate((270 * Math.PI) / 180);
+            ctx.fillText(text.toString(), 0, 0);
+            ctx.restore();
+        }
+        ctx.restore();
+    };
+    return CanvasImage;
+}());
+export { CanvasImage };
+//# sourceMappingURL=canvasImage.js.map

package/src/canvas/canvasImage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"canvasImage.js","sourceRoot":"","sources":["../../../../packages/core/src/canvas/canvasImage.ts"],"names":[],"mappings":"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"}

package/src/canvas/index.d.ts

@@ -0,0 +1,2 @@
+export * from './offscreen';
+export * from './canvas';

package/src/canvas/index.js

@@ -0,0 +1,3 @@
+export * from './offscreen';
+export * from './canvas';
+//# sourceMappingURL=index.js.map

package/src/canvas/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../packages/core/src/canvas/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC"}

package/src/canvas/magnifierCanvas.d.ts

@@ -0,0 +1,20 @@
+/// <reference types="offscreencanvas" />
+import { Meta2dStore } from '../store';
+import { Canvas } from './canvas';
+export declare class MagnifierCanvas {
+    parentCanvas: Canvas;
+    parentElement: HTMLElement;
+    store: Meta2dStore;
+    canvas: HTMLCanvasElement;
+    magnifierScreen: HTMLCanvasElement | OffscreenCanvas;
+    offscreen: HTMLCanvasElement | OffscreenCanvas;
+    private magnifierSize;
+    magnifier: boolean;
+    constructor(parentCanvas: Canvas, parentElement: HTMLElement, store: Meta2dStore);
+    resize(w?: number, h?: number): void;
+    /**
+     * 绘制到 该画布的 离屏层
+     */
+    private renderMagnifier;
+    render(): void;
+}

package/src/canvas/magnifierCanvas.js

@@ -0,0 +1,99 @@
+import { createOffscreen } from './offscreen';
+var MagnifierCanvas = /** @class */ (function () {
+    function MagnifierCanvas(parentCanvas, parentElement, store) {
+        this.parentCanvas = parentCanvas;
+        this.parentElement = parentElement;
+        this.store = store;
+        this.canvas = document.createElement('canvas');
+        this.magnifierScreen = createOffscreen();
+        this.offscreen = createOffscreen();
+        this.magnifierSize = 300;
+        parentElement.appendChild(this.canvas);
+        this.canvas.style.backgroundRepeat = 'no-repeat';
+        this.canvas.style.backgroundSize = '100% 100%';
+        this.canvas.style.position = 'absolute';
+        this.canvas.style.top = '0';
+        this.canvas.style.left = '0';
+    }
+    MagnifierCanvas.prototype.resize = function (w, h) {
+        this.canvas.style.width = w + 'px';
+        this.canvas.style.height = h + 'px';
+        w = (w * this.store.dpiRatio) | 0;
+        h = (h * this.store.dpiRatio) | 0;
+        this.canvas.width = w;
+        this.canvas.height = h;
+        this.offscreen.width = w;
+        this.offscreen.height = h;
+        this.offscreen
+            .getContext('2d')
+            .scale(this.store.dpiRatio, this.store.dpiRatio);
+        this.offscreen.getContext('2d').textBaseline = 'middle';
+        this.magnifierScreen.width = this.magnifierSize + 5;
+        this.magnifierScreen.height = this.magnifierSize + 5;
+    };
+    /**
+     * 绘制到 该画布的 离屏层
+     */
+    MagnifierCanvas.prototype.renderMagnifier = function () {
+        var _this = this;
+        if (!this.magnifier) {
+            return;
+        }
+        var r = this.magnifierSize / 2;
+        var size = this.magnifierSize + 5;
+        var ctx = this.magnifierScreen.getContext('2d');
+        ctx.clearRect(0, 0, size, size);
+        ctx.lineWidth = 5;
+        ctx.save();
+        ctx.translate(2.5, 2.5);
+        ctx.save();
+        ctx.arc(r, r, r, 0, Math.PI * 2, false);
+        ctx.clip();
+        ctx.fillStyle =
+            this.store.data.background || this.store.options.background || '#f4f4f4';
+        ctx.fillRect(0, 0, size, size);
+        ctx.translate(-r, -r);
+        ctx.scale(2, 2);
+        var pt = {
+            x: (this.parentCanvas.mousePos.x + this.store.data.x) *
+                this.store.dpiRatio,
+            y: (this.parentCanvas.mousePos.y + this.store.data.y) *
+                this.store.dpiRatio,
+        };
+        var drawOffscreens = [
+            this.parentCanvas.canvasImageBottom.offscreen,
+            this.parentCanvas.canvasImageBottom.animateOffsScreen,
+            this.parentCanvas.offscreen,
+            this.parentCanvas.canvasImage.offscreen,
+            this.parentCanvas.canvasImage.animateOffsScreen,
+        ];
+        drawOffscreens.forEach(function (offscreen) {
+            ctx.drawImage(offscreen, pt.x - r, pt.y - r, _this.magnifierSize, _this.magnifierSize, 0, 0, _this.magnifierSize, _this.magnifierSize);
+        });
+        ctx.restore();
+        ctx.beginPath();
+        var gradient = ctx.createRadialGradient(r, r, r - 5, r, r, r);
+        gradient.addColorStop(0, 'rgba(0,0,0,0.2)');
+        gradient.addColorStop(0.8, 'rgb(200,200,200)');
+        gradient.addColorStop(0.9, 'rgb(200,200,200)');
+        gradient.addColorStop(1.0, 'rgba(200,200,200,0.9)');
+        ctx.strokeStyle = gradient;
+        ctx.arc(r, r, r, 0, Math.PI * 2, false);
+        ctx.stroke();
+        ctx.restore();
+        var offscreenCtx = this.offscreen.getContext('2d');
+        offscreenCtx.drawImage(this.magnifierScreen, 0, 0, this.magnifierSize + 5, this.magnifierSize + 5, (pt.x - r - 2.5) / this.store.dpiRatio, (pt.y - r - 2.5) / this.store.dpiRatio, (this.magnifierSize + 5) / this.store.dpiRatio, (this.magnifierSize + 5) / this.store.dpiRatio);
+    };
+    MagnifierCanvas.prototype.render = function () {
+        this.offscreen
+            .getContext('2d')
+            .clearRect(0, 0, this.canvas.width, this.canvas.height);
+        this.renderMagnifier();
+        var ctx = this.canvas.getContext('2d');
+        ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
+        ctx.drawImage(this.offscreen, 0, 0, this.canvas.width, this.canvas.height);
+    };
+    return MagnifierCanvas;
+}());
+export { MagnifierCanvas };
+//# sourceMappingURL=magnifierCanvas.js.map

package/src/canvas/magnifierCanvas.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"magnifierCanvas.js","sourceRoot":"","sources":["../../../../packages/core/src/canvas/magnifierCanvas.ts"],"names":[],"mappings":"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"}

package/src/canvas/offscreen.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="offscreencanvas" />
+export declare function createOffscreen(): HTMLCanvasElement | OffscreenCanvas;

package/src/canvas/offscreen.js

@@ -0,0 +1,14 @@
+export function createOffscreen() {
+    try {
+        var offscreen = new OffscreenCanvas(0, 0);
+        var context = offscreen.getContext('2d');
+        if (context && context.arc) {
+            return offscreen;
+        }
+        return document.createElement('canvas');
+    }
+    catch (e) {
+        return document.createElement('canvas');
+    }
+}
+//# sourceMappingURL=offscreen.js.map

package/src/canvas/offscreen.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"offscreen.js","sourceRoot":"","sources":["../../../../packages/core/src/canvas/offscreen.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,eAAe;IAC7B,IAAI;QACF,IAAM,SAAS,GAAG,IAAI,eAAe,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;QAC5C,IAAM,OAAO,GAAG,SAAS,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;QAE3C,IAAI,OAAO,IAAI,OAAO,CAAC,GAAG,EAAE;YAC1B,OAAO,SAAS,CAAC;SAClB;QAED,OAAO,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;KACzC;IAAC,OAAO,CAAC,EAAE;QACV,OAAO,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;KACzC;AACH,CAAC"}