@hatiolab/things-scene 9.0.0-beta.2 → 9.0.0-beta.21

package/dist/layer/guide-layer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"guide-layer.js","sourceRoot":"","sources":["../../src/layer/guide-layer.js"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport Component from '../components/component'\nimport Rect from '../components/rect'\nimport Ruler from '../components/ruler'\nimport * as Const from '../const'\nimport Layer from './layer'\n\nconst HRULER_LEFT = 20\nconst HRULER_TOP = 0\nconst HRULER_ORIGIN = 20\n\nconst VRULER_LEFT = 0 /* 회전된 상태에서의 LEFT */\nconst VRULER_TOP = 20 /* 회전된 상태에서의 TOP */\nconst VRULER_ORIGIN = 20\n\nconst VRULER_ROTATE = (90 * Math.PI) / 180\n\nconst RULER_UNIT = 'm'\nconst RULER_MARGIN = 0\nconst RULER_FONT = '9px Verdana'\nconst RULER_HEIGHT = 20\nconst RULER_COLOR = '#f4f4f4'\nconst RULER_STROKE = '#999'\n\nfunction calcOriginRectCoord(translate, width, height) {\n  return {\n    left: -translate.x,\n    top: -translate.y,\n    width: HRULER_LEFT,\n    height: RULER_HEIGHT\n  }\n}\n\nfunction calcHRulerCoord(translate, width, height, ruler) {\n  return {\n    left: HRULER_LEFT - translate.x,\n    top: HRULER_TOP - translate.y,\n    origin: HRULER_ORIGIN - translate.x,\n    width: width - HRULER_LEFT,\n    height: RULER_HEIGHT\n  }\n}\n\nfunction calcVRulerCoord(translate, width, height, ruler) {\n  // 1. 레이어 관점의 좌표계에서 Ruler의 센터를 잡는다\n  var center = {\n    x: -translate.x + VRULER_LEFT + RULER_HEIGHT / 2,\n    y: -translate.y + VRULER_TOP + (height - VRULER_TOP) / 2\n  }\n\n  // 2. 계산된 센터값을 이용해서 Ruler의 LEFT TOP에 해당하는 지점의 Ruler 관점의 좌표값을 계산한다.\n  var right_top = Component.transcoordRR(-translate.x + VRULER_LEFT, -translate.y + VRULER_TOP, center, VRULER_ROTATE)\n\n  // 3. 변경된 속성값을 리턴한다.\n  return {\n    left: right_top.x - (height - VRULER_TOP),\n    top: right_top.y,\n    origin: VRULER_ORIGIN - translate.y,\n    width: height - VRULER_TOP,\n    height: RULER_HEIGHT\n  }\n}\n\nfunction calcBounds(layout) {\n  var translate = layout.get('translate')\n\n  return {\n    left: -translate.x,\n    top: -translate.y,\n    width: layout.canvas.width / Const.DPPX,\n    height: layout.canvas.height / Const.DPPX\n  }\n}\n\nexport default class GuideLayer extends Layer {\n  constructor(model, context) {\n    super(model, context)\n\n    this.appScale = {\n      x: 1,\n      y: 1\n    }\n\n    if (model.ruler !== 'disabled') {\n      this.hruler = new Ruler({\n        left: HRULER_LEFT,\n        top: HRULER_TOP,\n        origin: HRULER_ORIGIN,\n        margin: RULER_MARGIN,\n        height: RULER_HEIGHT,\n        unit: RULER_UNIT,\n        rotation: 0,\n        font: RULER_FONT,\n        fillStyle: RULER_COLOR,\n        strokeStyle: RULER_STROKE,\n        capturable: false\n      })\n\n      this.vruler = new Ruler({\n        left: 0,\n        top: 0,\n        origin: VRULER_ORIGIN,\n        margin: RULER_MARGIN,\n        height: RULER_HEIGHT,\n        unit: RULER_UNIT,\n        rotation: VRULER_ROTATE,\n        font: RULER_FONT,\n        side: 'top',\n        fillStyle: RULER_COLOR,\n        strokeStyle: RULER_STROKE,\n        capturable: false\n      })\n\n      this.origin_rect = new Rect({\n        left: -HRULER_ORIGIN,\n        top: -VRULER_ORIGIN,\n        width: HRULER_ORIGIN,\n        height: VRULER_ORIGIN,\n        fillStyle: RULER_COLOR,\n        strokeStyle: RULER_STROKE,\n        lineWidth: 1\n      })\n\n      this.addComponent(this.hruler)\n      this.addComponent(this.vruler)\n      this.addComponent(this.origin_rect)\n    }\n\n    this.invalidate()\n  }\n\n  get capturable() {\n    return false\n  }\n\n  ready() {\n    super.ready()\n    if (!this.hruler) {\n      this.screen_coord = calcBounds(this)\n      return\n    }\n\n    var rootModel = this.rootModel\n\n    var translate = Object.assign({}, rootModel.get('translate'))\n\n    if (translate.x < HRULER_LEFT) translate.x += HRULER_LEFT\n    if (translate.y < VRULER_TOP) translate.y += VRULER_TOP\n\n    /* set scale */\n    var scale = rootModel.get('scale') || { x: 1, y: 1 }\n\n    this.appScale = scale\n\n    this.hruler.set('scale', scale.x)\n    this.vruler.set('scale', scale.y)\n\n    /* set translate */\n    rootModel.set('translate', translate)\n    this.set('translate', translate)\n\n    this.screen_coord = calcBounds(this)\n    var { width, height } = this.screen_coord\n\n    this.hruler.set(calcHRulerCoord(translate, width, height, this.hruler))\n    this.vruler.set(calcVRulerCoord(translate, width, height, this.vruler))\n    this.origin_rect.set(calcOriginRectCoord(translate, width, height))\n  }\n\n  resize() {\n    super.resize()\n\n    this.screen_coord = calcBounds(this)\n    var { width, height } = this.screen_coord\n\n    if (this.hruler) {\n      /* 레이어의 디멘션이 변경될 때, Ruler의 초기 width 값을 설정한다. */\n      this.hruler.set(calcHRulerCoord(this.model.translate, width, height, this.hruler))\n      this.vruler.set(calcVRulerCoord(this.model.translate, width, height, this.vruler))\n      this.origin_rect.set(calcOriginRectCoord(this.model.translate, width, height))\n    }\n  }\n\n  render(ctx) {\n    // 선 그리기.\n    if (!this.guide) return\n\n    ctx.save()\n\n    var { x, y } = this.guide\n    var { top, left, width, height } = this.screen_coord\n\n    ctx.beginPath()\n\n    ctx.moveTo(x, top)\n    ctx.lineTo(x, top + height)\n\n    ctx.moveTo(left, y)\n    ctx.lineTo(left + width, y)\n\n    ctx.lineWidth = 1\n    ctx.strokeStyle = 'tomato'\n    ctx.setLineDash([2, 3])\n\n    ctx.font = '10px tahoma'\n\n    ctx.fillStyle = '#333'\n\n    var screen_coord = this.transcoordS2C(x, y, this.rootModel)\n\n    ctx.textBaseline = screen_coord.y > 200 ? 'bottom' : 'top'\n    ctx.textAlign = screen_coord.x > 200 ? 'right' : 'left'\n    var yMargin = screen_coord.y > 200 ? -5 : 5\n    var xMargin = screen_coord.x > 200 ? -5 : 5\n\n    var scaled_x = Math.round(x / this.appScale.x)\n    var scaled_y = Math.round(y / this.appScale.y)\n\n    ctx.fillText(` ${scaled_x}, ${scaled_y} `, x + xMargin, y + yMargin)\n\n    ctx.stroke()\n\n    ctx.restore()\n  }\n\n  get guide() {\n    return this._guide\n  }\n\n  set guide(guide) {\n    this._guide = guide\n\n    this.invalidate()\n  }\n\n  contains(x, y) {\n    return true\n  }\n\n  get eventMap() {\n    return {\n      '(root)': {\n        '(descendant)': {\n          mousemove: this.onmousemove_child,\n          mouseout: this.onmouseout_child,\n          /* CONFIRMME DragMove 이벤트 중에는 MouseMove 이벤트가 발생하지 않으므로 (현재까지는..), 아래 이벤트 핸들러를 추가해준다. */\n          dragmove: this.onmousemove_child\n        },\n        'model-layer': {\n          change: this.onchange_root_model\n        }\n      },\n      '(self)': {\n        '(descendant)': {\n          mousedown: this.onmousedown_origin\n        }\n      }\n    }\n  }\n\n  onmousedown_origin(e, hint) {\n    // 모델레이어의 원점을 움직인다.\n    this.rootModel.set('translate', {\n      x: HRULER_ORIGIN,\n      y: VRULER_ORIGIN\n    })\n  }\n\n  onchange_root_model(after, before, desc) {\n    if (after.scale) {\n      this.appScale = after.scale\n\n      if (this.hruler) {\n        this.hruler.set('scale', after.scale.x)\n        this.vruler.set('scale', after.scale.y)\n      }\n    }\n\n    if (after.translate) {\n      this.set({\n        translate: {\n          x: after.translate.x,\n          y: after.translate.y\n        }\n      })\n    }\n\n    if (after.scale || after.translate) {\n      this.screen_coord = calcBounds(this)\n\n      if (this.hruler) {\n        var { translate } = this.model\n        var { width, height } = this.screen_coord\n\n        this.hruler.set(calcHRulerCoord(translate, width, height, this.hruler))\n        this.vruler.set(calcVRulerCoord(translate, width, height, this.vruler))\n        this.origin_rect.set(calcOriginRectCoord(translate, width, height))\n      }\n\n      this._guide = null\n    }\n\n    this.invalidate()\n  }\n\n  onmouseout_child(e) {\n    this._guide = null\n    this.invalidate()\n  }\n\n  onmousemove_child(e, hint) {\n    if (e.target && e.target.tagName !== 'CANVAS') this.guide = null\n    else this.guide = this.transcoordC2S(e.offsetX, e.offsetY)\n  }\n}\n\nComponent.register('guide-layer', GuideLayer)\n"]}

package/dist/layer/index.d.ts

@@ -0,0 +1,7 @@
+export { default as ModelLayer } from "./model-layer";
+export { default as GuideLayer } from "./guide-layer";
+export { default as ShiftLayer } from "./shift-layer";
+export { default as AddLayer } from "./add-layer";
+export { default as SelectionLayer } from "./selection-layer";
+export { default as ModelingLayer } from "./modeling-layer";
+export { default as DecoTagLayer } from "./decotag-layer";

package/dist/layer/index.js

@@ -0,0 +1,11 @@
+/*
+ * Copyright © HatioLab Inc. All rights reserved.
+ */
+export { default as ModelLayer } from './model-layer';
+export { default as GuideLayer } from './guide-layer';
+export { default as ShiftLayer } from './shift-layer';
+export { default as AddLayer } from './add-layer';
+export { default as SelectionLayer } from './selection-layer';
+export { default as ModelingLayer } from './modeling-layer';
+export { default as DecoTagLayer } from './decotag-layer';
+//# sourceMappingURL=index.js.map

package/dist/layer/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/layer/index.js"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,eAAe,CAAA;AACrD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,eAAe,CAAA;AACrD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,eAAe,CAAA;AACrD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,aAAa,CAAA;AACjD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAC7D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,kBAAkB,CAAA;AAC3D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,iBAAiB,CAAA","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nexport { default as ModelLayer } from './model-layer'\nexport { default as GuideLayer } from './guide-layer'\nexport { default as ShiftLayer } from './shift-layer'\nexport { default as AddLayer } from './add-layer'\nexport { default as SelectionLayer } from './selection-layer'\nexport { default as ModelingLayer } from './modeling-layer'\nexport { default as DecoTagLayer } from './decotag-layer'\n"]}

package/dist/layer/layer.d.ts

@@ -0,0 +1,32 @@
+export default class Layer extends ContainerAbstract {
+    _draw_reserved: boolean;
+    __draw__: () => void;
+    throttle_render: () => void;
+    fitSize(element: any, fit: any, width: any, height: any): void;
+    resize(): void;
+    isLayer(): boolean;
+    get showOverflow(): any;
+    get anchors(): void;
+    createElement(): any;
+    set target(arg: any);
+    get target(): any;
+    _target: any;
+    element: any;
+    get canvas(): any;
+    set selected(arg: any);
+    get selected(): any;
+    set focused(arg: any);
+    get focused(): any;
+    getContext(): any;
+    _context2D: any;
+    draw(context: any): void;
+    prerender(context: any): void;
+    get rotatePoint(): {
+        x: number;
+        y: number;
+    };
+    contains(x: any, y: any): boolean;
+    invalidate(): void;
+    move(toward: any): void;
+}
+import ContainerAbstract from "../components/container-abstract";

package/dist/layer/layer.js

@@ -0,0 +1,155 @@
+/*
+ * Copyright © HatioLab Inc. All rights reserved.
+ */
+import Component from '../components/component';
+import ContainerAbstract from '../components/container-abstract';
+import * as Const from '../const';
+export default class Layer extends ContainerAbstract {
+    constructor(model, context) {
+        super(model, context);
+        model.translate = model.translate || {
+            x: 0,
+            y: 0
+        };
+        this._draw_reserved = false;
+        this.__draw__ = () => {
+            this._draw_reserved = false;
+            this.trigger('redraw');
+            this.reflow();
+            this.draw();
+        };
+        this.throttle_render = () => {
+            if (!this._draw_reserved)
+                requestAnimationFrame(this.__draw__);
+            this._draw_reserved = true;
+        };
+    }
+    fitSize(element, fit, width, height) {
+        if (!this.target)
+            return;
+        if (fit) {
+            let style = getComputedStyle(this.target);
+            width = width ? width : style ? parseFloat(style.getPropertyValue('width')) : this.target.clientWidth;
+            height = height ? height : style ? parseFloat(style.getPropertyValue('height')) : this.target.clientHeight;
+        }
+        else {
+            width = this.model.width;
+            height = this.model.height;
+        }
+        if (element.tagName == 'CANVAS') {
+            element.setAttribute('width', width * Const.DPPX);
+            element.setAttribute('height', height * Const.DPPX);
+        }
+        element.style.width = width + 'px';
+        element.style.height = height + 'px';
+    }
+    resize() {
+        this.fitSize(this.element, true);
+    }
+    isLayer() {
+        return true;
+    }
+    get showOverflow() {
+        return this.app.isEditMode;
+    }
+    get anchors() { }
+    createElement() {
+        var element = Component.createCanvas(1, 1);
+        element.style.position = 'absolute';
+        return element;
+    }
+    get target() {
+        return this._target;
+    }
+    set target(target) {
+        if (this._target && this.element)
+            this._target.removeChild(this.element);
+        this._target = target;
+        if (!target)
+            return;
+        if (!this.element)
+            this.element = this.createElement();
+        /*
+         * 캔바스의 크기 결정 순서
+         * 1. model의 설정에 크기 정보가 있다면, 그에 따라 상위 엘리먼트의 크기를 조정한다.
+         * 2. 부모 엘리먼트의 크기에 따라 캔바스의 폭과 높이를 맞춘다.
+         * 3. 캔바스의 스타일은 무조건, 부모 엘리먼트의 100%로 한다.
+         */
+        this.resize();
+        target.appendChild(this.element);
+    }
+    get canvas() {
+        return this.element;
+    }
+    dispose() {
+        // TODO Dispose를 효율적으로 처리할 수 있는 방법을 고안한다.
+        super.dispose();
+        // window.removeEventListener('resize', this._onresize);
+        this.target = null;
+        this.element = null;
+    }
+    get selected() {
+        return this.root.selected;
+    }
+    set selected(sels) {
+        this.root.selected = sels;
+    }
+    get focused() {
+        return this.root.focused;
+    }
+    set focused(container) {
+        this.root.focused = container;
+    }
+    getContext() {
+        if (!this._context2D)
+            this._context2D = this.canvas && this.canvas.getContext('2d');
+        return this._context2D;
+    }
+    /* 레어어의 draw는 외부에서 context를 제공하지 않으면, 자신의 캔바스의 컨텍스트를 이용해서 그린다. */
+    draw(context) {
+        if (!this.canvas)
+            return;
+        context = context || this.getContext();
+        if (!context)
+            return;
+        super.draw(context);
+    }
+    prerender(context) {
+        var { translate, scale = {
+            x: 1,
+            y: 1
+        }, rotation } = this.model;
+        context.clearRect(0, 0, context.canvas.width, context.canvas.height);
+        translate && context.translate(translate.x * Const.DPPX, translate.y * Const.DPPX);
+        context.scale(scale.x * Const.DPPX, scale.y * Const.DPPX);
+        rotation && context.rotate(rotation);
+    }
+    get rotatePoint() {
+        // 레이어의 중심은 원점이다.
+        return {
+            x: 0,
+            y: 0
+        };
+    }
+    /* contains는 보통 자식 클래스에서 오버라이드 해야한다. */
+    contains(x, y) {
+        return false;
+    }
+    invalidate() {
+        /*
+         * throttle 로직으로 호출을 최소화
+         * 빈번히 반복되는 invalidate()에 대해 비효율적으로 render()가 호출되는 것을 방지하기 위함
+         */
+        this.throttle_render();
+    }
+    move(toward) {
+        var translate = this.get('translate') || { x: 0, y: 0 };
+        this.set({
+            translate: {
+                x: translate.x + toward.x,
+                y: translate.y + toward.y
+            }
+        });
+    }
+}
+//# sourceMappingURL=layer.js.map

package/dist/layer/layer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"layer.js","sourceRoot":"","sources":["../../src/layer/layer.js"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,SAAS,MAAM,yBAAyB,CAAA;AAC/C,OAAO,iBAAiB,MAAM,kCAAkC,CAAA;AAChE,OAAO,KAAK,KAAK,MAAM,UAAU,CAAA;AAEjC,MAAM,CAAC,OAAO,OAAO,KAAM,SAAQ,iBAAiB;IAClD,YAAY,KAAK,EAAE,OAAO;QACxB,KAAK,CAAC,KAAK,EAAE,OAAO,CAAC,CAAA;QAErB,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,SAAS,IAAI;YACnC,CAAC,EAAE,CAAC;YACJ,CAAC,EAAE,CAAC;SACL,CAAA;QAED,IAAI,CAAC,cAAc,GAAG,KAAK,CAAA;QAE3B,IAAI,CAAC,QAAQ,GAAG,GAAG,EAAE;YACnB,IAAI,CAAC,cAAc,GAAG,KAAK,CAAA;YAE3B,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAA;YACtB,IAAI,CAAC,MAAM,EAAE,CAAA;YACb,IAAI,CAAC,IAAI,EAAE,CAAA;QACb,CAAC,CAAA;QAED,IAAI,CAAC,eAAe,GAAG,GAAG,EAAE;YAC1B,IAAI,CAAC,IAAI,CAAC,cAAc;gBAAE,qBAAqB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAA;YAC9D,IAAI,CAAC,cAAc,GAAG,IAAI,CAAA;QAC5B,CAAC,CAAA;IACH,CAAC;IAED,OAAO,CAAC,OAAO,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM;QACjC,IAAI,CAAC,IAAI,CAAC,MAAM;YAAE,OAAM;QAExB,IAAI,GAAG,EAAE;YACP,IAAI,KAAK,GAAG,gBAAgB,CAAC,IAAI,CAAC,MAAM,CAAC,CAAA;YAEzC,KAAK,GAAG,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU,CAAC,KAAK,CAAC,gBAAgB,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,WAAW,CAAA;YACrG,MAAM,GAAG,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU,CAAC,KAAK,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,YAAY,CAAA;SAC3G;aAAM;YACL,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAA;YACxB,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAA;SAC3B;QAED,IAAI,OAAO,CAAC,OAAO,IAAI,QAAQ,EAAE;YAC/B,OAAO,CAAC,YAAY,CAAC,OAAO,EAAE,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,CAAA;YACjD,OAAO,CAAC,YAAY,CAAC,QAAQ,EAAE,MAAM,GAAG,KAAK,CAAC,IAAI,CAAC,CAAA;SACpD;QAED,OAAO,CAAC,KAAK,CAAC,KAAK,GAAG,KAAK,GAAG,IAAI,CAAA;QAClC,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM,GAAG,IAAI,CAAA;IACtC,CAAC;IAED,MAAM;QACJ,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,CAAA;IAClC,CAAC;IAED,OAAO;QACL,OAAO,IAAI,CAAA;IACb,CAAC;IAED,IAAI,YAAY;QACd,OAAO,IAAI,CAAC,GAAG,CAAC,UAAU,CAAA;IAC5B,CAAC;IAED,IAAI,OAAO,KAAI,CAAC;IAEhB,aAAa;QACX,IAAI,OAAO,GAAG,SAAS,CAAC,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC,CAAA;QAC1C,OAAO,CAAC,KAAK,CAAC,QAAQ,GAAG,UAAU,CAAA;QAEnC,OAAO,OAAO,CAAA;IAChB,CAAC;IAED,IAAI,MAAM;QACR,OAAO,IAAI,CAAC,OAAO,CAAA;IACrB,CAAC;IAED,IAAI,MAAM,CAAC,MAAM;QACf,IAAI,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,OAAO;YAAE,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;QAExE,IAAI,CAAC,OAAO,GAAG,MAAM,CAAA;QAErB,IAAI,CAAC,MAAM;YAAE,OAAM;QAEnB,IAAI,CAAC,IAAI,CAAC,OAAO;YAAE,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,aAAa,EAAE,CAAA;QAEtD;;;;;WAKG;QAEH,IAAI,CAAC,MAAM,EAAE,CAAA;QAEb,MAAM,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;IAClC,CAAC;IAED,IAAI,MAAM;QACR,OAAO,IAAI,CAAC,OAAO,CAAA;IACrB,CAAC;IAED,OAAO;QACL,yCAAyC;QACzC,KAAK,CAAC,OAAO,EAAE,CAAA;QACf,wDAAwD;QAExD,IAAI,CAAC,MAAM,GAAG,IAAI,CAAA;QAClB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAA;IACrB,CAAC;IAED,IAAI,QAAQ;QACV,OAAO,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAA;IAC3B,CAAC;IAED,IAAI,QAAQ,CAAC,IAAI;QACf,IAAI,CAAC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAA;IAC3B,CAAC;IAED,IAAI,OAAO;QACT,OAAO,IAAI,CAAC,IAAI,CAAC,OAAO,CAAA;IAC1B,CAAC;IAED,IAAI,OAAO,CAAC,SAAS;QACnB,IAAI,CAAC,IAAI,CAAC,OAAO,GAAG,SAAS,CAAA;IAC/B,CAAC;IAED,UAAU;QACR,IAAI,CAAC,IAAI,CAAC,UAAU;YAAE,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAA;QAEnF,OAAO,IAAI,CAAC,UAAU,CAAA;IACxB,CAAC;IAED,iEAAiE;IACjE,IAAI,CAAC,OAAO;QACV,IAAI,CAAC,IAAI,CAAC,MAAM;YAAE,OAAM;QAExB,OAAO,GAAG,OAAO,IAAI,IAAI,CAAC,UAAU,EAAE,CAAA;QACtC,IAAI,CAAC,OAAO;YAAE,OAAM;QAEpB,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;IACrB,CAAC;IAED,SAAS,CAAC,OAAO;QACf,IAAI,EACF,SAAS,EACT,KAAK,GAAG;YACN,CAAC,EAAE,CAAC;YACJ,CAAC,EAAE,CAAC;SACL,EACD,QAAQ,EACT,GAAG,IAAI,CAAC,KAAK,CAAA;QAEd,OAAO,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,MAAM,CAAC,CAAA;QAEpE,SAAS,IAAI,OAAO,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,GAAG,KAAK,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC,GAAG,KAAK,CAAC,IAAI,CAAC,CAAA;QAElF,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,GAAG,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,GAAG,KAAK,CAAC,IAAI,CAAC,CAAA;QACzD,QAAQ,IAAI,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAA;IACtC,CAAC;IAED,IAAI,WAAW;QACb,iBAAiB;QACjB,OAAO;YACL,CAAC,EAAE,CAAC;YACJ,CAAC,EAAE,CAAC;SACL,CAAA;IACH,CAAC;IAED,uCAAuC;IACvC,QAAQ,CAAC,CAAC,EAAE,CAAC;QACX,OAAO,KAAK,CAAA;IACd,CAAC;IAED,UAAU;QACR;;;WAGG;QACH,IAAI,CAAC,eAAe,EAAE,CAAA;IACxB,CAAC;IAED,IAAI,CAAC,MAAM;QACT,IAAI,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAA;QAEvD,IAAI,CAAC,GAAG,CAAC;YACP,SAAS,EAAE;gBACT,CAAC,EAAE,SAAS,CAAC,CAAC,GAAG,MAAM,CAAC,CAAC;gBACzB,CAAC,EAAE,SAAS,CAAC,CAAC,GAAG,MAAM,CAAC,CAAC;aAC1B;SACF,CAAC,CAAA;IACJ,CAAC;CACF","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport Component from '../components/component'\nimport ContainerAbstract from '../components/container-abstract'\nimport * as Const from '../const'\n\nexport default class Layer extends ContainerAbstract {\n  constructor(model, context) {\n    super(model, context)\n\n    model.translate = model.translate || {\n      x: 0,\n      y: 0\n    }\n\n    this._draw_reserved = false\n\n    this.__draw__ = () => {\n      this._draw_reserved = false\n\n      this.trigger('redraw')\n      this.reflow()\n      this.draw()\n    }\n\n    this.throttle_render = () => {\n      if (!this._draw_reserved) requestAnimationFrame(this.__draw__)\n      this._draw_reserved = true\n    }\n  }\n\n  fitSize(element, fit, width, height) {\n    if (!this.target) return\n\n    if (fit) {\n      let style = getComputedStyle(this.target)\n\n      width = width ? width : style ? parseFloat(style.getPropertyValue('width')) : this.target.clientWidth\n      height = height ? height : style ? parseFloat(style.getPropertyValue('height')) : this.target.clientHeight\n    } else {\n      width = this.model.width\n      height = this.model.height\n    }\n\n    if (element.tagName == 'CANVAS') {\n      element.setAttribute('width', width * Const.DPPX)\n      element.setAttribute('height', height * Const.DPPX)\n    }\n\n    element.style.width = width + 'px'\n    element.style.height = height + 'px'\n  }\n\n  resize() {\n    this.fitSize(this.element, true)\n  }\n\n  isLayer() {\n    return true\n  }\n\n  get showOverflow() {\n    return this.app.isEditMode\n  }\n\n  get anchors() {}\n\n  createElement() {\n    var element = Component.createCanvas(1, 1)\n    element.style.position = 'absolute'\n\n    return element\n  }\n\n  get target() {\n    return this._target\n  }\n\n  set target(target) {\n    if (this._target && this.element) this._target.removeChild(this.element)\n\n    this._target = target\n\n    if (!target) return\n\n    if (!this.element) this.element = this.createElement()\n\n    /*\n     * 캔바스의 크기 결정 순서\n     * 1. model의 설정에 크기 정보가 있다면, 그에 따라 상위 엘리먼트의 크기를 조정한다.\n     * 2. 부모 엘리먼트의 크기에 따라 캔바스의 폭과 높이를 맞춘다.\n     * 3. 캔바스의 스타일은 무조건, 부모 엘리먼트의 100%로 한다.\n     */\n\n    this.resize()\n\n    target.appendChild(this.element)\n  }\n\n  get canvas() {\n    return this.element\n  }\n\n  dispose() {\n    // TODO Dispose를 효율적으로 처리할 수 있는 방법을 고안한다.\n    super.dispose()\n    // window.removeEventListener('resize', this._onresize);\n\n    this.target = null\n    this.element = null\n  }\n\n  get selected() {\n    return this.root.selected\n  }\n\n  set selected(sels) {\n    this.root.selected = sels\n  }\n\n  get focused() {\n    return this.root.focused\n  }\n\n  set focused(container) {\n    this.root.focused = container\n  }\n\n  getContext() {\n    if (!this._context2D) this._context2D = this.canvas && this.canvas.getContext('2d')\n\n    return this._context2D\n  }\n\n  /* 레어어의 draw는 외부에서 context를 제공하지 않으면, 자신의 캔바스의 컨텍스트를 이용해서 그린다. */\n  draw(context) {\n    if (!this.canvas) return\n\n    context = context || this.getContext()\n    if (!context) return\n\n    super.draw(context)\n  }\n\n  prerender(context) {\n    var {\n      translate,\n      scale = {\n        x: 1,\n        y: 1\n      },\n      rotation\n    } = this.model\n\n    context.clearRect(0, 0, context.canvas.width, context.canvas.height)\n\n    translate && context.translate(translate.x * Const.DPPX, translate.y * Const.DPPX)\n\n    context.scale(scale.x * Const.DPPX, scale.y * Const.DPPX)\n    rotation && context.rotate(rotation)\n  }\n\n  get rotatePoint() {\n    // 레이어의 중심은 원점이다.\n    return {\n      x: 0,\n      y: 0\n    }\n  }\n\n  /* contains는 보통 자식 클래스에서 오버라이드 해야한다. */\n  contains(x, y) {\n    return false\n  }\n\n  invalidate() {\n    /*\n     * throttle 로직으로 호출을 최소화\n     * 빈번히 반복되는 invalidate()에 대해 비효율적으로 render()가 호출되는 것을 방지하기 위함\n     */\n    this.throttle_render()\n  }\n\n  move(toward) {\n    var translate = this.get('translate') || { x: 0, y: 0 }\n\n    this.set({\n      translate: {\n        x: translate.x + toward.x,\n        y: translate.y + toward.y\n      }\n    })\n  }\n}\n"]}

package/dist/layer/model-layer.d.ts

@@ -0,0 +1,46 @@
+declare class ModelLayer extends Layer {
+    isRootModel(): boolean;
+    get stuck(): boolean;
+    get layout(): {
+        reflow: (container: any, component: any) => void;
+        capturables: (container: any) => any;
+        drawables: (container: any) => any;
+        isStuck: (component: any) => boolean;
+        ABSOLUTE: boolean;
+    };
+    get overlay(): HTMLDivElement;
+    _overlay: HTMLDivElement | undefined;
+    createElement(): HTMLDivElement;
+    _canvas: any;
+    get MPP(): number;
+    get eventMap(): {
+        '(self)': {
+            '(all)': {
+                change: (after: any, before: any, hint: any) => void;
+                mouseenter: (event: any, hint: any) => void;
+                mouseleave: (event: any, hint: any) => void;
+                click: (event: any, hint: any) => void;
+                mousedown: (event: any, hint: any) => void;
+                mouseup: (event: any, hint: any) => void;
+                touchstart: (event: any, hint: any) => void;
+                touchend: (event: any, hint: any) => void;
+            };
+        };
+    };
+    closeScene(data: any): void;
+    _repositionOverlay(): void;
+    onchange(after: any): void;
+    _onchanged_all(after: any, before: any, hint: any): void;
+    _onmouseenter_all(event: any, hint: any): void;
+    _onmouseleave_all(event: any, hint: any): void;
+    _onclick(event: any, hint: any): void;
+    _onmousedownup(event: any, hint: any): void;
+    _doMouseDownUpEventAction(event: any, component: any, enter: any, org_event: any): void;
+    _doEventAction(event: any, component: any, enter: any, org_event: any): void;
+}
+declare namespace ModelLayer {
+    export { ScenePopup as Popup };
+}
+export default ModelLayer;
+import Layer from "./layer";
+import ScenePopup from "./action/popup";