@operato/scene-visualizer 1.2.11 → 1.2.13

package/dist/threed/real-object-extrude.js.map

@@ -1 +1 @@
-{"version":3,"file":"real-object-extrude.js","sourceRoot":"","sources":["../../src/threed/real-object-extrude.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,SAAS,MAAM,YAAY,CAAA;AAElC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAE1C,OAAO,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAA;AAC7D,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAC9C,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAErC,MAAM,OAAO,iBAAkB,SAAQ,UAAU;IAK/C,IAAI,KAAK;QACP,OAAO,IAAI,CAAA;IACb,CAAC;IAED,IAAI,SAAS;QACX,OAAO,IAAI,CAAA;IACb,CAAC;IAED,IAAI,gBAAgB;QAClB,IAAI,CAAC,IAAI,CAAC,iBAAiB;YAAE,IAAI,CAAC,iBAAiB,GAAG,IAAI,gBAAgB,EAAE,CAAA;QAE5E,OAAO,IAAI,CAAC,iBAAiB,CAAA;IAC/B,CAAC;IAED,KAAK;QACH,KAAK,CAAC,KAAK,EAAE,CAAA;QAEb,IAAI,EAAE,KAAK,GAAG,CAAC,EAAE,SAAS,GAAG,QAAQ,EAAE,WAAW,GAAG,QAAQ,EAAE,SAAS,GAAG,CAAC,EAAE,KAAK,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAEhH,UAAU;QACV,IAAI,KAAK,GAAG,IAAI,CAAC,KAAK,CAAA;QACtB,IAAI,CAAC,KAAK,EAAE;YACV,OAAM;SACP;QAED,IAAI,gBAAgB,GAAG,IAAI,CAAC,gBAAgB,CAAA;QAE5C,IAAI,gBAAgB,EAAE;YACpB,gBAAgB,CAAC,QAAQ,CAAC;gBACxB,aAAa,EAAE,KAAK;gBACpB,eAAe,EAAE;oBACf,KAAK;iBACN;aACF,CAAC,CAAA;SACH;QAED,IAAI,QAAQ,GAAG,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAA;QAEzC,IAAI,SAAS,IAAI,SAAS,IAAI,MAAM,EAAE;YACpC,IAAI,QAAQ,GAAG,IAAI,CAAC,cAAc,EAAE,CAAA;YACpC,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,UAAU,CAAC,QAAQ,EAAE,QAA0B,CAAC,CAAA;YACtE,IAAI,CAAC,SAAS,CAAC,UAAU,GAAG,IAAI,CAAA;YAEhC,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;SAClC;QAED,IAAI,WAAW,IAAI,WAAW,IAAI,aAAa,IAAI,SAAS,GAAG,CAAC,EAAE;YAChE,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,cAAc,CAAC,QAAQ,EAAE,KAAK,CAAC,6BAA6B,CAAC,CAAA;YACnF,IAAI,CAAC,SAAS,CAAC,UAAU,GAAG,IAAI,CAAA;YAEhC,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;SAClC;IACH,CAAC;IAED,cAAc,CAAC,KAAkB;QAC/B,MAAM,EAAE,KAAK,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAE1C,MAAM,eAAe,GAAG;YACtB,KAAK,EAAE,CAAC;YACR,KAAK;YACL,YAAY,EAAE,KAAK;YACnB,WAAW,EAAE,IAAI,CAAC,gBAAgB;SACH,CAAA;QAEjC,IAAI,QAAQ,GAAG,IAAI,KAAK,CAAC,eAAe,CAAC,KAAK,EAAE,eAAe,CAAC,CAAA;QAChE,QAAQ,CAAC,MAAM,EAAE,CAAA;QAEjB,OAAO,QAAe,CAAA;IACxB,CAAC;IAED,cAAc;QACZ,IAAI,EAAE,SAAS,GAAG,OAAO,EAAE,KAAK,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAE7D,IAAI,MAAM,GAAG,EAAS,CAAA;QACtB,IAAI,OAAO,GAAG,KAAK,CAAA;QACnB,MAAM,OAAO,GAAG,UAAU,CAAC,qBAAqB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;QAEhE,IAAI,OAAO,EAAE;YACX,MAAM,GAAG;gBACP,GAAG,EAAE,OAAO;gBACZ,IAAI,EAAE,KAAK,CAAC,SAAS;aACtB,CAAA;SACF;aAAM,IAAI,OAAO,SAAS,IAAI,QAAQ,EAAE;YACvC,IAAI,SAAS,KAAK,aAAa,EAAE;gBAC/B,MAAM,CAAC,KAAK,GAAG,SAAS,CAAA;gBACxB,OAAO,IAAI,SAAS,CAAC,SAAS,CAAC,CAAC,QAAQ,EAAE,CAAA;aAC3C;iBAAM;gBACL,OAAO,GAAG,CAAC,CAAA;aACZ;SACF;QAED,OAAO,IAAI,KAAK,CAAC,oBAAoB,CAAC;YACpC,GAAG,MAAM;YACT,OAAO;YACP,WAAW,EAAE,OAAO,GAAG,CAAC;YACxB,SAAS,EAAE,GAAG;YACd,SAAS,EAAE,GAAG;SACf,CAAC,CAAA;IACJ,CAAC;IAED,UAAU,CAAC,QAA8B,EAAE,QAAwB;QACjE,IAAI,IAAI,GAAG,IAAI,KAAK,CAAC,IAAI,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAA;QAC7C,IAAI,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,GAAG,CAAC,CAAA;QAC9B,IAAI,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAA;QAC1B,IAAI,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAA;QAE1B,OAAO,IAAI,CAAA;IACb,CAAC;IAED,cAAc,CAAC,QAA8B,EAAE,KAAkB;QAC/D,IAAI,EAAE,WAAW,GAAG,QAAQ,EAAE,KAAK,GAAG,CAAC,EAAE,SAAS,GAAG,CAAC,EAAE,KAAK,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAE1F,IAAI,IAAI,GAAG,IAAI,KAAK,CAAC,IAAI,EAAE,CAAA;QAC3B,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,SAAS,EAAE,CAAC,CAAA;QAErC,IAAI,YAAY,GAAG,IAAI,KAAK,CAAC,oBAAoB,CAAC;YAChD,KAAK,EAAE,WAAW;YAClB,SAAS,EAAE,GAAG;YACd,SAAS,EAAE,GAAG;SACf,CAAC,CAAA;QAEF,IAAI,eAAe,GAAG,SAAS,CAAC,WAAW,CAAC,CAAA;QAC5C,IAAI,WAAW,GAAG,eAAe,CAAC,QAAQ,EAAE,CAAA;QAC5C,YAAY,CAAC,OAAO,GAAG,KAAK,GAAG,WAAW,CAAA;QAC1C,YAAY,CAAC,WAAW,GAAG,KAAK,GAAG,CAAC,IAAI,WAAW,GAAG,CAAC,CAAA;QAEvD,uCAAuC;QACvC,YAAY,CAAC,aAAa,GAAG,IAAI,CAAA;QACjC,YAAY,CAAC,mBAAmB,GAAG,CAAC,GAAG,CAAA;QAEvC,KAAK,GAAG,IAAI,CAAC,SAAS,IAAI,KAAK,CAAA;QAC/B,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;QAEtB,IAAI,mBAAmB,GAAG;YACxB,KAAK,EAAE,CAAC;YACR,KAAK,EAAE,KAAK,GAAG,CAAC;YAChB,YAAY,EAAE,IAAI;YAClB,cAAc,EAAE,CAAC;YACjB,SAAS,EAAE,SAAS;YACpB,iBAAiB,EAAE,CAAC;SACrB,CAAA;QAED,IAAI,YAAY,GAAG,IAAI,KAAK,CAAC,eAAe,CAAC,KAAK,EAAE,mBAAmB,CAAC,CAAA;QACxE,YAAY,CAAC,MAAM,EAAE,CAAA;QAErB,IAAI,QAAQ,GAAG,IAAI,KAAK,CAAC,IAAI,CAAC,YAAY,EAAE,YAAY,CAAC,CAAA;QACzD,QAAQ,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,GAAG,CAAC,CAAA;QAClC,QAAQ,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAA;QAC9B,QAAQ,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAA;QAE9B,OAAO,QAAQ,CAAA;IACjB,CAAC;IAED,aAAa;QACX,SAAS,YAAY,CAAC,CAAS;YAC7B,IAAI,KAAK,GAAG,CAAC,CAAA;YAEb,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE;gBACvB,OAAO,CAAC,CAAA;aACT;YAED,OAAO,CAAC,IAAI,CAAC,EAAE;gBACb,CAAC,KAAK,CAAC,CAAA;gBACP,KAAK,IAAI,CAAC,CAAA;aACX;YAED,OAAO,CAAC,IAAI,KAAK,CAAA;QACnB,CAAC;QAED,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAA;QAE7C,wDAAwD;QACxD,IAAI,YAAY,GAAG,YAAY,CAAC,KAAK,CAAC,CAAA;QACtC,IAAI,aAAa,GAAG,YAAY,CAAC,MAAM,CAAC,CAAA;QAExC,IAAI,MAAM,GAAG,YAAY,CAAC,YAAY,EAAE,aAAa,CAAC,CAAA;QACtD,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,UAAU,CAAC,IAAI,CAAE,CAAC,CAAA;QAE/C,IAAI,OAAO,GAAG,IAAI,KAAK,CAAC,aAAa,CAAC,MAAM,CAAC,CAAA;QAE7C,OAAO,CAAC,WAAW,GAAG,IAAI,CAAA;QAC1B,OAAO,CAAC,KAAK,GAAG,KAAK,CAAC,cAAc,CAAA;QACpC,OAAO,CAAC,KAAK,GAAG,KAAK,CAAC,cAAc,CAAA;QACpC,OAAO,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,GAAG,MAAM,GAAG,aAAa,CAAC,CAAA;QACjD,OAAO,CAAC,MAAM,CAAC,GAAG,CAAC,KAAK,GAAG,YAAY,EAAE,MAAM,GAAG,aAAa,CAAC,CAAA;QAChE,OAAO,CAAC,SAAS,GAAG,KAAK,CAAC,YAAY,CAAA;QAEtC,OAAO,OAAO,CAAA;IAChB,CAAC;IAED,WAAW;QACT,IAAI,EAAE,KAAK,GAAG,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAE9D,IAAI,CAAC,SAAS,IAAI,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,KAAK,EAAE,SAAS,CAAC,CAAA;QACvE,IAAI,CAAC,SAAS,IAAI,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,EAAE,KAAK,EAAE,SAAS,IAAI,SAAS,CAAC,WAAW,CAAC,CAAA;IAClG,CAAC;IAED,iBAAiB;;QACf,IAAI,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAE1C,IAAI,OAAO,WAAW,IAAI,QAAQ,EAAE;YAClC,CAAC;YAAA,CAAC,MAAA,IAAI,CAAC,SAAS,0CAAE,QAAuC,CAAA,CAAC,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAA;SACjF;IACH,CAAC;IAED,eAAe;;QACb,IAAI,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QACxC,IAAI,QAAQ,GAAG,MAAA,IAAI,CAAC,SAAS,0CAAE,QAAqC,CAAA;QACpE,IAAI,CAAC,QAAQ,EAAE;YACb,OAAM;SACP;QAED,MAAM,OAAO,GAAG,UAAU,CAAC,qBAAqB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;QAEhE,IAAI,OAAO,EAAE;YACX,QAAQ,CAAC,GAAG,GAAG,OAAO,CAAA;SACvB;aAAM,IAAI,OAAO,SAAS,IAAI,QAAQ,EAAE;YACvC,IAAI,SAAS,KAAK,aAAa,EAAE;gBAC/B,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC,CAAA;aAC9B;iBAAM;gBACL,gCAAgC;gBAChC,QAAQ,CAAC,OAAO,GAAG,CAAC,CAAA;aACrB;SACF;IACH,CAAC;IAED,IAAI,oBAAoB;QACtB,OAAO,CAAC,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,CAAC,CAAA;IACrD,CAAC;CACF","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport * as THREE from 'three'\nimport tinycolor from 'tinycolor2'\n\nimport { RealObject } from './real-object'\n\nimport { BoundUVGenerator } from './utils/bound-uv-generator'\nimport { createCanvas } from './html/elements'\nimport { applyAlpha } from './common'\n\nexport class RealObjectExtrude extends RealObject {\n  _boundUVGenerator?: BoundUVGenerator\n  private _mainMesh?: THREE.Mesh\n  private _sideMesh?: THREE.Mesh\n\n  get shape(): any {\n    return null\n  }\n\n  get sideShape() {\n    return null\n  }\n\n  get boundUVGenerator() {\n    if (!this._boundUVGenerator) this._boundUVGenerator = new BoundUVGenerator()\n\n    return this._boundUVGenerator\n  }\n\n  build() {\n    super.build()\n\n    var { depth = 1, fillStyle = 0xffffff, strokeStyle = 0x636363, lineWidth = 1, alpha = 1 } = this.component.state\n\n    // 다각형 그리기\n    var shape = this.shape\n    if (!shape) {\n      return\n    }\n\n    var boundUVGenerator = this.boundUVGenerator\n\n    if (boundUVGenerator) {\n      boundUVGenerator.setShape({\n        extrudedShape: shape,\n        extrudedOptions: {\n          depth\n        }\n      })\n    }\n\n    var geometry = this.createGeometry(shape)\n\n    if (fillStyle && fillStyle != 'none') {\n      var material = this.createMaterial()\n      this._mainMesh = this.createMesh(geometry, material as THREE.Material)\n      this._mainMesh.castShadow = true\n\n      this.object3d.add(this._mainMesh)\n    }\n\n    if (strokeStyle && strokeStyle != 'transparent' && lineWidth > 0) {\n      this._sideMesh = this.createSideMesh(geometry, shape /* FIXME , extrudeSettings */)\n      this._sideMesh.castShadow = true\n\n      this.object3d.add(this._sideMesh)\n    }\n  }\n\n  createGeometry(shape: THREE.Shape): THREE.BufferGeometry {\n    const { depth = 1 } = this.component.state\n\n    const extrudeSettings = {\n      steps: 1,\n      depth,\n      bevelEnabled: false,\n      UVGenerator: this.boundUVGenerator\n    } as THREE.ExtrudeGeometryOptions\n\n    var geometry = new THREE.ExtrudeGeometry(shape, extrudeSettings)\n    geometry.center()\n\n    return geometry as any\n  }\n\n  createMaterial() {\n    var { fillStyle = 'black', alpha = 1 } = this.component.state\n\n    var params = {} as any\n    var opacity = alpha\n    const texture = RealObject.buildFillStyleTexture(this.component)\n\n    if (texture) {\n      params = {\n        map: texture,\n        side: THREE.FrontSide\n      }\n    } else if (typeof fillStyle == 'string') {\n      if (fillStyle !== 'transparent') {\n        params.color = fillStyle\n        opacity *= tinycolor(fillStyle).getAlpha()\n      } else {\n        opacity = 0\n      }\n    }\n\n    return new THREE.MeshStandardMaterial({\n      ...params,\n      opacity,\n      transparent: opacity < 1,\n      metalness: 0.5,\n      roughness: 0.5\n    })\n  }\n\n  createMesh(geometry: THREE.BufferGeometry, material: THREE.Material) {\n    var mesh = new THREE.Mesh(geometry, material)\n    mesh.rotation.x = -Math.PI / 2\n    mesh.rotation.y = -Math.PI\n    mesh.rotation.z = -Math.PI\n\n    return mesh\n  }\n\n  createSideMesh(geometry: THREE.BufferGeometry, shape: THREE.Shape) {\n    var { strokeStyle = 0x000000, depth = 1, lineWidth = 0, alpha = 1 } = this.component.state\n\n    var hole = new THREE.Path()\n    hole.setFromPoints(shape.getPoints())\n\n    var sideMaterial = new THREE.MeshStandardMaterial({\n      color: strokeStyle,\n      metalness: 0.5,\n      roughness: 0.5\n    })\n\n    var tinyStrokeStyle = tinycolor(strokeStyle)\n    var strokeAlpha = tinyStrokeStyle.getAlpha()\n    sideMaterial.opacity = alpha * strokeAlpha\n    sideMaterial.transparent = alpha < 1 || strokeAlpha < 1\n\n    // prevent overlapped layers flickering\n    sideMaterial.polygonOffset = true\n    sideMaterial.polygonOffsetFactor = -0.1\n\n    shape = this.sideShape || shape\n    shape.holes.push(hole)\n\n    var sideExtrudeSettings = {\n      steps: 1,\n      depth: depth + 1,\n      bevelEnabled: true,\n      bevelThickness: 0,\n      bevelSize: lineWidth,\n      bevelSizeSegments: 5\n    }\n\n    var sideGeometry = new THREE.ExtrudeGeometry(shape, sideExtrudeSettings)\n    sideGeometry.center()\n\n    var sideMesh = new THREE.Mesh(sideGeometry, sideMaterial)\n    sideMesh.rotation.x = -Math.PI / 2\n    sideMesh.rotation.y = -Math.PI\n    sideMesh.rotation.z = -Math.PI\n\n    return sideMesh\n  }\n\n  createTexture() {\n    function nextPowerOf2(n: number) {\n      var count = 0\n\n      if (n && !(n & (n - 1))) {\n        return n\n      }\n\n      while (n != 0) {\n        n >>= 1\n        count += 1\n      }\n\n      return 1 << count\n    }\n\n    var { width, height } = this.component.bounds\n\n    // TODO component.text의 heavy한 로직을 반복적으로 실행하지 않도록, 캐싱하자.\n    var poweredWidth = nextPowerOf2(width)\n    var poweredHeight = nextPowerOf2(height)\n\n    let canvas = createCanvas(poweredWidth, poweredHeight)\n    this.component.render(canvas.getContext('2d')!)\n\n    var texture = new THREE.CanvasTexture(canvas)\n\n    texture.needsUpdate = true\n    texture.wrapS = THREE.RepeatWrapping\n    texture.wrapT = THREE.RepeatWrapping\n    texture.offset.set(0, 1 - height / poweredHeight)\n    texture.repeat.set(width / poweredWidth, height / poweredHeight)\n    texture.minFilter = THREE.LinearFilter\n\n    return texture\n  }\n\n  updateAlpha() {\n    var { alpha = 1, fillStyle, lineStyle } = this.component.state\n\n    this._mainMesh && applyAlpha(this._mainMesh.material, alpha, fillStyle)\n    this._sideMesh && applyAlpha(this._sideMesh.material, alpha, lineStyle && lineStyle.strokeStyle)\n  }\n\n  updateStrokeStyle() {\n    var { strokeStyle } = this.component.state\n\n    if (typeof strokeStyle == 'string') {\n      ;(this._sideMesh?.material as THREE.MeshStandardMaterial).color.set(strokeStyle)\n    }\n  }\n\n  updateFillStyle() {\n    var { fillStyle } = this.component.state\n    var material = this._mainMesh?.material as THREE.MeshLambertMaterial\n    if (!material) {\n      return\n    }\n\n    const texture = RealObject.buildFillStyleTexture(this.component)\n\n    if (texture) {\n      material.map = texture\n    } else if (typeof fillStyle == 'string') {\n      if (fillStyle !== 'transparent') {\n        material.color.set(fillStyle)\n      } else {\n        // material.color.set(fillStyle)\n        material.opacity = 0\n      }\n    }\n  }\n\n  get rebuildingProperties(): string[] {\n    return ['width', 'height', 'depth', 'text', 'path']\n  }\n}\n"]}
+{"version":3,"file":"real-object-extrude.js","sourceRoot":"","sources":["../../src/threed/real-object-extrude.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport * as THREE from 'three'\n\nimport { RealObject } from './real-object'\n\nimport { BoundUVGenerator } from './utils/bound-uv-generator'\nimport { createCanvas } from './html/elements'\nimport { applyAlpha } from './common'\n\nexport class RealObjectExtrude extends RealObject {\n  _boundUVGenerator?: BoundUVGenerator\n  private _mainMesh?: THREE.Mesh\n  private _sideMesh?: THREE.Mesh\n\n  get shape(): any {\n    return null\n  }\n\n  get sideShape() {\n    return null\n  }\n\n  get boundUVGenerator() {\n    if (!this._boundUVGenerator) this._boundUVGenerator = new BoundUVGenerator()\n\n    return this._boundUVGenerator\n  }\n\n  build() {\n    super.build()\n\n    var { depth = 1 } = this.component.state\n\n    // 다각형 그리기\n    var shape = this.shape\n    if (!shape) {\n      return\n    }\n\n    var boundUVGenerator = this.boundUVGenerator\n\n    if (boundUVGenerator) {\n      boundUVGenerator.setShape({\n        extrudedShape: shape,\n        extrudedOptions: {\n          depth\n        }\n      })\n    }\n\n    var geometry = this.createGeometry(shape)\n\n    var material = this.createMainMaterial()\n    this._mainMesh = this.createMainMesh(geometry, material as THREE.Material)\n    this._mainMesh.castShadow = true\n\n    this.object3d.add(this._mainMesh)\n\n    this._sideMesh = this.createSideMesh(geometry, shape /* FIXME , extrudeSettings */)\n    this._sideMesh.castShadow = true\n\n    this.object3d.add(this._sideMesh)\n\n    this.updateFillStyle()\n    this.updateStrokeStyle()\n  }\n\n  createGeometry(shape: THREE.Shape): THREE.BufferGeometry {\n    const { depth = 1 } = this.component.state\n\n    const extrudeSettings = {\n      steps: 1,\n      depth,\n      bevelEnabled: false,\n      UVGenerator: this.boundUVGenerator\n    } as THREE.ExtrudeGeometryOptions\n\n    var geometry = new THREE.ExtrudeGeometry(shape, extrudeSettings)\n    geometry.center()\n\n    return geometry as any\n  }\n\n  createMainMaterial() {\n    return new THREE.MeshStandardMaterial({\n      metalness: 0.5,\n      roughness: 0.5\n    })\n  }\n\n  createMainMesh(geometry: THREE.BufferGeometry, material: THREE.Material) {\n    var mesh = new THREE.Mesh(geometry, material)\n    mesh.rotation.x = -Math.PI / 2\n    mesh.rotation.y = -Math.PI\n    mesh.rotation.z = -Math.PI\n\n    return mesh\n  }\n\n  createSideMesh(geometry: THREE.BufferGeometry, shape: THREE.Shape) {\n    var { depth = 1, lineWidth = 0 } = this.component.state\n\n    var hole = new THREE.Path()\n    hole.setFromPoints(shape.getPoints())\n\n    var sideMaterial = new THREE.MeshStandardMaterial({\n      metalness: 0.5,\n      roughness: 0.5,\n      // prevent overlapped layers flickering\n      polygonOffset: true,\n      polygonOffsetFactor: -0.1\n    })\n\n    shape = this.sideShape || shape\n    shape.holes.push(hole)\n\n    var sideExtrudeSettings = {\n      steps: 1,\n      depth: depth + 1,\n      bevelEnabled: true,\n      bevelThickness: 0,\n      bevelSize: lineWidth,\n      bevelSizeSegments: 5\n    }\n\n    var sideGeometry = new THREE.ExtrudeGeometry(shape, sideExtrudeSettings)\n    sideGeometry.center()\n\n    var sideMesh = new THREE.Mesh(sideGeometry, sideMaterial)\n    sideMesh.rotation.x = -Math.PI / 2\n    sideMesh.rotation.y = -Math.PI\n    sideMesh.rotation.z = -Math.PI\n\n    return sideMesh\n  }\n\n  createTexture() {\n    function nextPowerOf2(n: number) {\n      var count = 0\n\n      if (n && !(n & (n - 1))) {\n        return n\n      }\n\n      while (n != 0) {\n        n >>= 1\n        count += 1\n      }\n\n      return 1 << count\n    }\n\n    var { width, height } = this.component.bounds\n\n    var poweredWidth = nextPowerOf2(width)\n    var poweredHeight = nextPowerOf2(height)\n\n    let canvas = createCanvas(poweredWidth, poweredHeight)\n    this.component.render(canvas.getContext('2d')!)\n\n    var texture = new THREE.CanvasTexture(canvas)\n\n    texture.needsUpdate = true\n    texture.wrapS = THREE.RepeatWrapping\n    texture.wrapT = THREE.RepeatWrapping\n    texture.offset.set(0, 1 - height / poweredHeight)\n    texture.repeat.set(width / poweredWidth, height / poweredHeight)\n    texture.minFilter = THREE.LinearFilter\n\n    return texture\n  }\n\n  updateAlpha() {\n    var { alpha = 1, fillStyle, strokeStyle } = this.component.state\n\n    this._mainMesh && applyAlpha(this._mainMesh.material, alpha, fillStyle)\n    this._sideMesh && applyAlpha(this._sideMesh.material, alpha, strokeStyle)\n  }\n\n  updateStrokeStyle() {\n    const material = this._sideMesh?.material as THREE.MeshStandardMaterial\n    if (!material) {\n      return\n    }\n\n    var { strokeStyle } = this.component.state\n\n    material.color.set(strokeStyle)\n  }\n\n  updateFillStyle() {\n    var { fillStyle, alpha = 1 } = this.component.state\n\n    var material = this._mainMesh?.material as THREE.MeshStandardMaterial\n    if (!material) {\n      return\n    }\n\n    const texture = RealObject.buildFillStyleTexture(this.component)\n\n    if (texture) {\n      material.map = texture\n    } else {\n      material.color.set(fillStyle)\n    }\n  }\n}\n"]}

package/dist/threed/real-object-gltf.d.ts

@@ -9,7 +9,5 @@ export declare class RealObjectGLTF extends RealObject {
     build(): void;
     private gltfLoaded;
     clear(): THREE.Object3D<THREE.Event>;
-    _rescale(): void;
     updateDimension(): void;
-    get rebuildingProperties(): string[];
 }

package/dist/threed/real-object-gltf.js

@@ -64,7 +64,7 @@ export class RealObjectGLTF extends RealObject {
         this.pivot = new THREE.Object3D();
         this.object3d.add(this.pivot);
         this.pivot.add(object);
-        this._rescale();
+        this.updateDimension();
         if (animations && animations.length) {
             for (var i = 0; i < animations.length; i++) {
                 var animation = animations[i];
@@ -81,18 +81,12 @@ export class RealObjectGLTF extends RealObject {
         // 반복적으로 로딩하면 WebGL 리소스 부족으로 오류 발생.
         return super.clear();
     }
-    _rescale() {
+    updateDimension() {
         var { width = 1, height = 1, depth = 1 } = this.component.state;
         var { x = 1, y = 1, z = 1 } = this.objectSize || {};
         this.pivot && this.pivot.scale.set(width / x, depth / y, height / z);
         this.component.invalidate();
     }
-    updateDimension() {
-        this._rescale();
-    }
-    get rebuildingProperties() {
-        return ['fillStyle', 'lineStyle', 'text'];
-    }
 }
 RealObjectGLTF._GLTFLoader = new GLTFLoader();
 //# sourceMappingURL=real-object-gltf.js.map

package/dist/threed/real-object-gltf.js.map

@@ -1 +1 @@
-{"version":3,"file":"real-object-gltf.js","sourceRoot":"","sources":["../../src/threed/real-object-gltf.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAA;AAE9C,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAE1C,OAAO,EAAQ,UAAU,EAAE,MAAM,0CAA0C,CAAA;AAC3E,OAAO,EAAE,WAAW,EAAE,MAAM,wCAAwC,CAAA;AACpE,OAAO,EAAE,UAAU,EAAE,MAAM,uCAAuC,CAAA;AAClE,aAAa;AACb,OAAO,EAAE,cAAc,EAAE,MAAM,mDAAmD,CAAA;AAElF,MAAM,OAAO,cAAe,SAAQ,UAAU;IAA9C;;QAIU,eAAU,GAAmB,IAAI,KAAK,CAAC,OAAO,EAAE,CAAA;IA+G1D,CAAC;IA7GC,MAAM,KAAK,UAAU;QACnB,OAAO,cAAc,CAAC,WAAW,CAAA;IACnC,CAAC;IAED,KAAK;QACH,KAAK,CAAC,KAAK,EAAE,CAAA;QAEb,IAAI,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAElC,IAAI,CAAC,GAAG,EAAE;YACR,IAAI,CAAC,KAAK,EAAE,CAAA;YACZ,OAAM;SACP;QAED,IAAI,UAAU,GAAG,IAAI,UAAU,EAAE,CAAA;QAEjC,0EAA0E;QAC1E,MAAM,WAAW,GAAG,IAAI,WAAW,EAAE,CAAA;QACrC,WAAW,CAAC,cAAc,CAAC,8CAA8C,CAAC,CAAA;QAC1E,UAAU,CAAC,cAAc,CAAC,WAAW,CAAC,CAAA;QAEtC,MAAM,UAAU,GAAG,IAAI,UAAU,EAAE,CAAA;QACnC,UAAU,CAAC,iBAAiB,CAAC,8CAA8C,CAAC,CAAA;QAC5E,UAAU,CAAC,aAAa,CAAC,IAAI,CAAC,cAAe,CAAC,UAAW,CAAC,CAAA;QAC1D,UAAU,CAAC,aAAa,CAAC,UAAU,CAAC,CAAA;QAEpC,UAAU,CAAC,iBAAiB,CAAC,cAAc,CAAC,CAAA;QAE5C,IAAI,OAAO,GAAG,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;QACzC,UAAU,CAAC,cAAc,CAAC,iBAAiB,CAAC,CAAA;QAE5C,UAAU,CAAC,IAAI,CACb,OAAO,EACP,IAAI,CAAC,EAAE;YACL,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,CAAA;QACvB,CAAC,EACD,GAAG,CAAC,EAAE;YACJ,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,MAAM,GAAG,GAAG,CAAC,KAAK,CAAC,GAAG,GAAG,CAAC,GAAG,UAAU,CAAC,CAAA;QACtE,CAAC,EACD,GAAG,CAAC,EAAE;YACJ,KAAK,CAAC,iBAAiB,EAAE,GAAG,CAAC,CAAA;YAC7B,IAAI,CAAC,KAAK,EAAE,CAAA;QACd,CAAC,CACF,CAAA;IACH,CAAC;IAEO,UAAU,CAAC,IAAU;QAC3B,IAAI,KAAK,GAAG,IAAI,CAAC,KAAK,CAAA;QAEtB,IAAI,UAAU,GAAG,IAAI,CAAC,UAAU,CAAA;QAChC,IAAI,MAAM,GAAG,KAAK,CAAC,KAAK,EAAE,CAAA;QAC1B,MAAM,CAAC,QAAQ,CAAC,OAAO,GAAG,IAAI,CAAA;QAE9B,MAAM,CAAC,QAAQ,CAAC,CAAC,KAAqB,EAAE,EAAE;YACxC,IAAK,KAAa,CAAC,MAAM,EAAE;gBACzB,KAAK,CAAC,UAAU,GAAG,IAAI,CAAA;aACxB;QACH,CAAC,CAAC,CAAA;QAEF,IAAI,WAAW,GAAG,IAAI,KAAK,CAAC,IAAI,EAAE,CAAC,aAAa,CAAC,MAAM,CAAC,CAAA;QACxD,IAAI,MAAM,GAAG,WAAW,CAAC,SAAS,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAA;QACnD,IAAI,CAAC,UAAU,GAAG,WAAW,CAAC,OAAO,CAAC,IAAI,CAAC,UAAW,CAAC,CAAA;QAEvD,MAAM,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAA;QAEzB,6CAA6C;QAC7C,IAAI,CAAC,KAAK,EAAE,CAAA;QAEZ,IAAI,CAAC,KAAK,GAAG,IAAI,KAAK,CAAC,QAAQ,EAAE,CAAA;QACjC,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QAC7B,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,MAAM,CAAC,CAAA;QAEtB,IAAI,CAAC,QAAQ,EAAE,CAAA;QAEf,IAAI,UAAU,IAAI,UAAU,CAAC,MAAM,EAAE;YACnC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,UAAU,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;gBAC1C,IAAI,SAAS,GAAG,UAAU,CAAC,CAAC,CAAC,CAAA;gBAC7B,IAAI,MAAM,GAAG,IAAI,CAAC,cAAe,CAAC,KAAM,CAAC,UAAU,CAAC,SAAS,CAAC,CAAA;gBAC9D,MAAM,CAAC,IAAI,EAAE,CAAA;aACd;SACF;aAAM;YACL,OAAO,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAA;SAC/B;IACH,CAAC;IAED,KAAK;QACH,yCAAyC;QACzC,mCAAmC;QAEnC,OAAO,KAAK,CAAC,KAAK,EAAE,CAAA;IACtB,CAAC;IAED,QAAQ;QACN,IAAI,EAAE,KAAK,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,EAAE,KAAK,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAE/D,IAAI,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,UAAU,IAAI,EAAE,CAAA;QAEnD,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,GAAG,CAAC,EAAE,KAAK,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,CAAA;QAEpE,IAAI,CAAC,SAAS,CAAC,UAAU,EAAE,CAAA;IAC7B,CAAC;IAED,eAAe;QACb,IAAI,CAAC,QAAQ,EAAE,CAAA;IACjB,CAAC;IAED,IAAI,oBAAoB;QACtB,OAAO,CAAC,WAAW,EAAE,WAAW,EAAE,MAAM,CAAC,CAAA;IAC3C,CAAC;;AAjHc,0BAAW,GAAG,IAAI,UAAU,EAAE,CAAA","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport * as THREE from 'three'\nimport { error } from '@hatiolab/things-scene'\n\nimport { RealObject } from './real-object'\n\nimport { GLTF, GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js'\nimport { DRACOLoader } from 'three/examples/jsm/loaders/DRACOLoader'\nimport { KTX2Loader } from 'three/examples/jsm/loaders/KTX2Loader'\n// @ts-ignore\nimport { MeshoptDecoder } from 'three/examples/jsm/libs/meshopt_decoder.module.js'\n\nexport class RealObjectGLTF extends RealObject {\n  private static _GLTFLoader = new GLTFLoader()\n\n  private pivot?: THREE.Object3D\n  private objectSize?: THREE.Vector3 = new THREE.Vector3()\n\n  static get GLTFLoader() {\n    return RealObjectGLTF._GLTFLoader\n  }\n\n  build() {\n    super.build()\n\n    var { src } = this.component.state\n\n    if (!src) {\n      this.clear()\n      return\n    }\n\n    let gltfLoader = new GLTFLoader()\n\n    // Optional: Provide a DRACOLoader instance to decode compressed mesh data\n    const dracoLoader = new DRACOLoader()\n    dracoLoader.setDecoderPath('/node_modules/three/examples/jsm/libs/draco/')\n    gltfLoader.setDRACOLoader(dracoLoader)\n\n    const ktx2Loader = new KTX2Loader()\n    ktx2Loader.setTranscoderPath(`/node_modules/three/examples/jsm/libs/basis/`)\n    ktx2Loader.detectSupport(this.threeContainer!.renderer3d!)\n    gltfLoader.setKTX2Loader(ktx2Loader)\n\n    gltfLoader.setMeshoptDecoder(MeshoptDecoder)\n\n    var fullSrc = this.component.app.url(src)\n    gltfLoader.setCrossOrigin('use-credentials')\n\n    gltfLoader.load(\n      fullSrc,\n      gltf => {\n        this.gltfLoaded(gltf)\n      },\n      xhr => {\n        console.log(Math.round((xhr.loaded / xhr.total) * 100) + '% loaded')\n      },\n      err => {\n        error('GLTFLoader.load', err)\n        this.clear()\n      }\n    )\n  }\n\n  private gltfLoaded(gltf: GLTF) {\n    let scene = gltf.scene\n\n    var animations = gltf.animations\n    var object = scene.clone()\n    object.userData.context = this\n\n    object.traverse((child: THREE.Object3D) => {\n      if ((child as any).isMesh) {\n        child.castShadow = true\n      }\n    })\n\n    var boundingBox = new THREE.Box3().setFromObject(object)\n    var center = boundingBox.getCenter(object.position)\n    this.objectSize = boundingBox.getSize(this.objectSize!)\n\n    center.multiplyScalar(-1)\n\n    // 오브젝트 공백을 최소로 하기위해서 clear() 를 최대한 pending함.\n    this.clear()\n\n    this.pivot = new THREE.Object3D()\n    this.object3d.add(this.pivot)\n    this.pivot.add(object)\n\n    this._rescale()\n\n    if (animations && animations.length) {\n      for (var i = 0; i < animations.length; i++) {\n        var animation = animations[i]\n        var action = this.threeContainer!.mixer!.clipAction(animation)\n        action.play()\n      }\n    } else {\n      console.log('no animations..')\n    }\n  }\n\n  clear() {\n    // TODO gltf object 리소스 해제가 필요하면, 여기에 추가.\n    // 반복적으로 로딩하면 WebGL 리소스 부족으로 오류 발생.\n\n    return super.clear()\n  }\n\n  _rescale() {\n    var { width = 1, height = 1, depth = 1 } = this.component.state\n\n    var { x = 1, y = 1, z = 1 } = this.objectSize || {}\n\n    this.pivot && this.pivot.scale.set(width / x, depth / y, height / z)\n\n    this.component.invalidate()\n  }\n\n  updateDimension() {\n    this._rescale()\n  }\n\n  get rebuildingProperties(): string[] {\n    return ['fillStyle', 'lineStyle', 'text']\n  }\n}\n"]}
+{"version":3,"file":"real-object-gltf.js","sourceRoot":"","sources":["../../src/threed/real-object-gltf.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport * as THREE from 'three'\nimport { error } from '@hatiolab/things-scene'\n\nimport { RealObject } from './real-object'\n\nimport { GLTF, GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js'\nimport { DRACOLoader } from 'three/examples/jsm/loaders/DRACOLoader'\nimport { KTX2Loader } from 'three/examples/jsm/loaders/KTX2Loader'\n// @ts-ignore\nimport { MeshoptDecoder } from 'three/examples/jsm/libs/meshopt_decoder.module.js'\n\nexport class RealObjectGLTF extends RealObject {\n  private static _GLTFLoader = new GLTFLoader()\n\n  private pivot?: THREE.Object3D\n  private objectSize?: THREE.Vector3 = new THREE.Vector3()\n\n  static get GLTFLoader() {\n    return RealObjectGLTF._GLTFLoader\n  }\n\n  build() {\n    super.build()\n\n    var { src } = this.component.state\n\n    if (!src) {\n      this.clear()\n      return\n    }\n\n    let gltfLoader = new GLTFLoader()\n\n    // Optional: Provide a DRACOLoader instance to decode compressed mesh data\n    const dracoLoader = new DRACOLoader()\n    dracoLoader.setDecoderPath('/node_modules/three/examples/jsm/libs/draco/')\n    gltfLoader.setDRACOLoader(dracoLoader)\n\n    const ktx2Loader = new KTX2Loader()\n    ktx2Loader.setTranscoderPath(`/node_modules/three/examples/jsm/libs/basis/`)\n    ktx2Loader.detectSupport(this.threeContainer!.renderer3d!)\n    gltfLoader.setKTX2Loader(ktx2Loader)\n\n    gltfLoader.setMeshoptDecoder(MeshoptDecoder)\n\n    var fullSrc = this.component.app.url(src)\n    gltfLoader.setCrossOrigin('use-credentials')\n\n    gltfLoader.load(\n      fullSrc,\n      gltf => {\n        this.gltfLoaded(gltf)\n      },\n      xhr => {\n        console.log(Math.round((xhr.loaded / xhr.total) * 100) + '% loaded')\n      },\n      err => {\n        error('GLTFLoader.load', err)\n        this.clear()\n      }\n    )\n  }\n\n  private gltfLoaded(gltf: GLTF) {\n    let scene = gltf.scene\n\n    var animations = gltf.animations\n    var object = scene.clone()\n    object.userData.context = this\n\n    object.traverse((child: THREE.Object3D) => {\n      if ((child as any).isMesh) {\n        child.castShadow = true\n      }\n    })\n\n    var boundingBox = new THREE.Box3().setFromObject(object)\n    var center = boundingBox.getCenter(object.position)\n    this.objectSize = boundingBox.getSize(this.objectSize!)\n\n    center.multiplyScalar(-1)\n\n    // 오브젝트 공백을 최소로 하기위해서 clear() 를 최대한 pending함.\n    this.clear()\n\n    this.pivot = new THREE.Object3D()\n    this.object3d.add(this.pivot)\n    this.pivot.add(object)\n\n    this.updateDimension()\n\n    if (animations && animations.length) {\n      for (var i = 0; i < animations.length; i++) {\n        var animation = animations[i]\n        var action = this.threeContainer!.mixer!.clipAction(animation)\n        action.play()\n      }\n    } else {\n      console.log('no animations..')\n    }\n  }\n\n  clear() {\n    // TODO gltf object 리소스 해제가 필요하면, 여기에 추가.\n    // 반복적으로 로딩하면 WebGL 리소스 부족으로 오류 발생.\n\n    return super.clear()\n  }\n\n  updateDimension() {\n    var { width = 1, height = 1, depth = 1 } = this.component.state\n\n    var { x = 1, y = 1, z = 1 } = this.objectSize || {}\n\n    this.pivot && this.pivot.scale.set(width / x, depth / y, height / z)\n\n    this.component.invalidate()\n  }\n}\n"]}

package/dist/threed/real-object-mesh.d.ts

@@ -5,7 +5,8 @@ export declare abstract class RealObjectMesh extends RealObject<THREE.Mesh> {
     build(): void;
     updateAlpha(): void;
     updateHidden(): void;
-    protected abstract buildGeometry(): THREE.BufferGeometry;
-    buildMaterial(): THREE.Material;
+    updateFillStyle(): void;
+    protected abstract buildGeometry(): void;
+    buildMaterial(): void;
     clear(): THREE.Mesh<THREE.BufferGeometry, THREE.Material | THREE.Material[]>;
 }

package/dist/threed/real-object-mesh.js

@@ -10,8 +10,8 @@ export class RealObjectMesh extends RealObject {
     }
     build() {
         super.build();
-        this.object3d.geometry = this.buildGeometry();
-        this.object3d.material = this.buildMaterial();
+        this.buildGeometry();
+        this.buildMaterial();
     }
     /* overide */
     updateAlpha() {
@@ -21,22 +21,31 @@ export class RealObjectMesh extends RealObject {
     updateHidden() {
         this.object3d.visible = !this.component.state.hidden;
     }
-    buildMaterial() {
+    updateFillStyle() {
         var { fillStyle } = this.component.state;
-        var params = {};
+        var material = this.object3d.material;
+        if (!material) {
+            return;
+        }
         const texture = RealObject.buildFillStyleTexture(this.component);
         if (texture) {
-            params = {
-                map: texture
-            };
+            texture.needsUpdate = true;
+            material.map = texture;
         }
-        else {
-            params = {
-                color: fillStyle || '#FFF'
-            };
+        else if (typeof fillStyle == 'string') {
+            if (fillStyle !== 'transparent') {
+                material.color.set(fillStyle);
+            }
+            else {
+                material.opacity = 0;
+            }
         }
-        const material = new THREE.MeshLambertMaterial(params);
-        return material;
+    }
+    buildMaterial() {
+        this.object3d.material = new THREE.MeshStandardMaterial({
+            transparent: true,
+            side: THREE.DoubleSide
+        });
     }
     clear() {
         this.object3d.traverse((mesh) => {

package/dist/threed/real-object-mesh.js.map

@@ -1 +1 @@
-{"version":3,"file":"real-object-mesh.js","sourceRoot":"","sources":["../../src/threed/real-object-mesh.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AACrC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAE1C,MAAM,OAAgB,cAAe,SAAQ,UAAsB;IACvD,mBAAmB;QAC3B,OAAO,IAAI,KAAK,CAAC,IAAI,EAAE,CAAA;IACzB,CAAC;IAED,KAAK;QACH,KAAK,CAAC,KAAK,EAAE,CAAA;QAEb,IAAI,CAAC,QAAQ,CAAC,QAAQ,GAAG,IAAI,CAAC,aAAa,EAAE,CAAA;QAC7C,IAAI,CAAC,QAAQ,CAAC,QAAQ,GAAG,IAAI,CAAC,aAAa,EAAE,CAAA;IAC/C,CAAC;IAED,aAAa;IAEb,WAAW;QACT,IAAI,EAAE,KAAK,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAEnD,UAAU,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,EAAE,KAAK,EAAE,SAAS,CAAC,CAAA;IACtD,CAAC;IAED,YAAY;QACV,IAAI,CAAC,QAAQ,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,CAAA;IACtD,CAAC;IAID,aAAa;QACX,IAAI,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAExC,IAAI,MAAM,GAAQ,EAAE,CAAA;QACpB,MAAM,OAAO,GAAG,UAAU,CAAC,qBAAqB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;QAEhE,IAAI,OAAO,EAAE;YACX,MAAM,GAAG;gBACP,GAAG,EAAE,OAAO;aACb,CAAA;SACF;aAAM;YACL,MAAM,GAAG;gBACP,KAAK,EAAE,SAAS,IAAI,MAAM;aAC3B,CAAA;SACF;QAED,MAAM,QAAQ,GAAG,IAAI,KAAK,CAAC,mBAAmB,CAAC,MAAM,CAAC,CAAA;QAEtD,OAAO,QAAQ,CAAA;IACjB,CAAC;IAED,KAAK;QACH,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,IAAS,EAAE,EAAE;YACnC,IAAI,IAAI,CAAC,MAAM,EAAE;gBACf,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE,CACtB;gBAAA,CAAC,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAM,EAAE,EAAE,CAAC,CAAC,CAAC,OAAO,IAAI,CAAC,CAAC,OAAO,EAAE,CAAC,CAAA;aACxG;QACH,CAAC,CAAC,CAAA;QAEF,OAAO,KAAK,CAAC,KAAK,EAAE,CAAA;IACtB,CAAC;CACF","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport * as THREE from 'three'\n\nimport { applyAlpha } from './common'\nimport { RealObject } from './real-object'\n\nexport abstract class RealObjectMesh extends RealObject<THREE.Mesh> {\n  protected getObject3dInstance() {\n    return new THREE.Mesh()\n  }\n\n  build() {\n    super.build()\n\n    this.object3d.geometry = this.buildGeometry()\n    this.object3d.material = this.buildMaterial()\n  }\n\n  /* overide */\n\n  updateAlpha() {\n    var { alpha = 1, fillStyle } = this.component.state\n\n    applyAlpha(this.object3d.material, alpha, fillStyle)\n  }\n\n  updateHidden() {\n    this.object3d.visible = !this.component.state.hidden\n  }\n\n  protected abstract buildGeometry(): THREE.BufferGeometry\n\n  buildMaterial(): THREE.Material {\n    var { fillStyle } = this.component.state\n\n    var params: any = {}\n    const texture = RealObject.buildFillStyleTexture(this.component)\n\n    if (texture) {\n      params = {\n        map: texture\n      }\n    } else {\n      params = {\n        color: fillStyle || '#FFF'\n      }\n    }\n\n    const material = new THREE.MeshLambertMaterial(params)\n\n    return material\n  }\n\n  clear() {\n    this.object3d.traverse((mesh: any) => {\n      if (mesh.isMesh) {\n        mesh.geometry.dispose()\n        ;(mesh.material.length ? mesh.material : [mesh.material]).forEach((m: any) => m.dispose && m.dispose())\n      }\n    })\n\n    return super.clear()\n  }\n}\n"]}
+{"version":3,"file":"real-object-mesh.js","sourceRoot":"","sources":["../../src/threed/real-object-mesh.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AACrC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAE1C,MAAM,OAAgB,cAAe,SAAQ,UAAsB;IACvD,mBAAmB;QAC3B,OAAO,IAAI,KAAK,CAAC,IAAI,EAAE,CAAA;IACzB,CAAC;IAED,KAAK;QACH,KAAK,CAAC,KAAK,EAAE,CAAA;QAEb,IAAI,CAAC,aAAa,EAAE,CAAA;QACpB,IAAI,CAAC,aAAa,EAAE,CAAA;IACtB,CAAC;IAED,aAAa;IAEb,WAAW;QACT,IAAI,EAAE,KAAK,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAEnD,UAAU,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,EAAE,KAAK,EAAE,SAAS,CAAC,CAAA;IACtD,CAAC;IAED,YAAY;QACV,IAAI,CAAC,QAAQ,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,CAAA;IACtD,CAAC;IAED,eAAe;QACb,IAAI,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QACxC,IAAI,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,QAAsC,CAAA;QACnE,IAAI,CAAC,QAAQ,EAAE;YACb,OAAM;SACP;QAED,MAAM,OAAO,GAAG,UAAU,CAAC,qBAAqB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;QAEhE,IAAI,OAAO,EAAE;YACX,OAAO,CAAC,WAAW,GAAG,IAAI,CAAA;YAC1B,QAAQ,CAAC,GAAG,GAAG,OAAO,CAAA;SACvB;aAAM,IAAI,OAAO,SAAS,IAAI,QAAQ,EAAE;YACvC,IAAI,SAAS,KAAK,aAAa,EAAE;gBAC/B,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC,CAAA;aAC9B;iBAAM;gBACL,QAAQ,CAAC,OAAO,GAAG,CAAC,CAAA;aACrB;SACF;IACH,CAAC;IAID,aAAa;QACX,IAAI,CAAC,QAAQ,CAAC,QAAQ,GAAG,IAAI,KAAK,CAAC,oBAAoB,CAAC;YACtD,WAAW,EAAE,IAAI;YACjB,IAAI,EAAE,KAAK,CAAC,UAAU;SACvB,CAAC,CAAA;IACJ,CAAC;IAED,KAAK;QACH,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,IAAS,EAAE,EAAE;YACnC,IAAI,IAAI,CAAC,MAAM,EAAE;gBACf,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE,CACtB;gBAAA,CAAC,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAM,EAAE,EAAE,CAAC,CAAC,CAAC,OAAO,IAAI,CAAC,CAAC,OAAO,EAAE,CAAC,CAAA;aACxG;QACH,CAAC,CAAC,CAAA;QAEF,OAAO,KAAK,CAAC,KAAK,EAAE,CAAA;IACtB,CAAC;CACF","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport * as THREE from 'three'\n\nimport { applyAlpha } from './common'\nimport { RealObject } from './real-object'\n\nexport abstract class RealObjectMesh extends RealObject<THREE.Mesh> {\n  protected getObject3dInstance() {\n    return new THREE.Mesh()\n  }\n\n  build() {\n    super.build()\n\n    this.buildGeometry()\n    this.buildMaterial()\n  }\n\n  /* overide */\n\n  updateAlpha() {\n    var { alpha = 1, fillStyle } = this.component.state\n\n    applyAlpha(this.object3d.material, alpha, fillStyle)\n  }\n\n  updateHidden() {\n    this.object3d.visible = !this.component.state.hidden\n  }\n\n  updateFillStyle() {\n    var { fillStyle } = this.component.state\n    var material = this.object3d.material as THREE.MeshStandardMaterial\n    if (!material) {\n      return\n    }\n\n    const texture = RealObject.buildFillStyleTexture(this.component)\n\n    if (texture) {\n      texture.needsUpdate = true\n      material.map = texture\n    } else if (typeof fillStyle == 'string') {\n      if (fillStyle !== 'transparent') {\n        material.color.set(fillStyle)\n      } else {\n        material.opacity = 0\n      }\n    }\n  }\n\n  protected abstract buildGeometry(): void\n\n  buildMaterial(): void {\n    this.object3d.material = new THREE.MeshStandardMaterial({\n      transparent: true,\n      side: THREE.DoubleSide\n    })\n  }\n\n  clear() {\n    this.object3d.traverse((mesh: any) => {\n      if (mesh.isMesh) {\n        mesh.geometry.dispose()\n        ;(mesh.material.length ? mesh.material : [mesh.material]).forEach((m: any) => m.dispose && m.dispose())\n      }\n    })\n\n    return super.clear()\n  }\n}\n"]}

package/dist/threed/real-object-plane.d.ts

@@ -1,6 +1,5 @@
-import * as THREE from 'three';
 import { RealObjectMesh } from './real-object-mesh';
 export declare class RealObjectPlane extends RealObjectMesh {
-    buildGeometry(): THREE.PlaneGeometry;
-    buildMaterial(): THREE.MeshBasicMaterial;
+    buildGeometry(): void;
+    buildMaterial(): void;
 }

package/dist/threed/real-object-plane.js

@@ -9,15 +9,14 @@ import { RealObjectMesh } from './real-object-mesh';
 export class RealObjectPlane extends RealObjectMesh {
     buildGeometry() {
         var { width, height } = this.component.state.dimension;
-        return new THREE.PlaneGeometry(width, height);
+        this.object3d.geometry = new THREE.PlaneGeometry(width, height);
     }
     buildMaterial() {
-        var material = new THREE.MeshBasicMaterial();
-        material.color.set('black');
-        material.opacity = 0;
-        material.side = THREE.DoubleSide;
-        material.blending = THREE.NoBlending;
-        return material;
+        this.object3d.material = new THREE.MeshStandardMaterial({
+            opacity: 0,
+            side: THREE.DoubleSide,
+            blending: THREE.NoBlending
+        });
     }
 }
 //# sourceMappingURL=real-object-plane.js.map

package/dist/threed/real-object-plane.js.map

@@ -1 +1 @@
-{"version":3,"file":"real-object-plane.js","sourceRoot":"","sources":["../../src/threed/real-object-plane.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH;;EAEE;AAEF,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAA;AAEnD,MAAM,OAAO,eAAgB,SAAQ,cAAc;IACjD,aAAa;QACX,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,CAAA;QAEtD,OAAO,IAAI,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE,MAAM,CAAC,CAAA;IAC/C,CAAC;IAED,aAAa;QACX,IAAI,QAAQ,GAAG,IAAI,KAAK,CAAC,iBAAiB,EAAE,CAAA;QAE5C,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,CAAA;QAC3B,QAAQ,CAAC,OAAO,GAAG,CAAC,CAAA;QACpB,QAAQ,CAAC,IAAI,GAAG,KAAK,CAAC,UAAU,CAAA;QAChC,QAAQ,CAAC,QAAQ,GAAG,KAAK,CAAC,UAAU,CAAA;QAEpC,OAAO,QAAQ,CAAA;IACjB,CAAC;CACF","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\n/* \n  Inspired by http://learningthreejs.com/blog/2013/04/30/closing-the-gap-between-html-and-webgl/\n*/\n\nimport * as THREE from 'three'\n\nimport { RealObjectMesh } from './real-object-mesh'\n\nexport class RealObjectPlane extends RealObjectMesh {\n  buildGeometry() {\n    var { width, height } = this.component.state.dimension\n\n    return new THREE.PlaneGeometry(width, height)\n  }\n\n  buildMaterial() /* : THREE.MeshMaterialType | THREE.MeshMaterialType[] */ {\n    var material = new THREE.MeshBasicMaterial()\n\n    material.color.set('black')\n    material.opacity = 0\n    material.side = THREE.DoubleSide\n    material.blending = THREE.NoBlending\n\n    return material\n  }\n}\n"]}
+{"version":3,"file":"real-object-plane.js","sourceRoot":"","sources":["../../src/threed/real-object-plane.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH;;EAEE;AAEF,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAA;AAEnD,MAAM,OAAO,eAAgB,SAAQ,cAAc;IACjD,aAAa;QACX,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,CAAA;QAEtD,IAAI,CAAC,QAAQ,CAAC,QAAQ,GAAG,IAAI,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE,MAAM,CAAC,CAAA;IACjE,CAAC;IAED,aAAa;QACX,IAAI,CAAC,QAAQ,CAAC,QAAQ,GAAG,IAAI,KAAK,CAAC,oBAAoB,CAAC;YACtD,OAAO,EAAE,CAAC;YACV,IAAI,EAAE,KAAK,CAAC,UAAU;YACtB,QAAQ,EAAE,KAAK,CAAC,UAAU;SAC3B,CAAC,CAAA;IACJ,CAAC;CACF","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\n/* \n  Inspired by http://learningthreejs.com/blog/2013/04/30/closing-the-gap-between-html-and-webgl/\n*/\n\nimport * as THREE from 'three'\n\nimport { RealObjectMesh } from './real-object-mesh'\n\nexport class RealObjectPlane extends RealObjectMesh {\n  buildGeometry() {\n    var { width, height } = this.component.state.dimension\n\n    this.object3d.geometry = new THREE.PlaneGeometry(width, height)\n  }\n\n  buildMaterial() /* : THREE.MeshMaterialType | THREE.MeshMaterialType[] */ {\n    this.object3d.material = new THREE.MeshStandardMaterial({\n      opacity: 0,\n      side: THREE.DoubleSide,\n      blending: THREE.NoBlending\n    })\n  }\n}\n"]}

package/dist/threed/real-object-sprite-2d.js

@@ -6,7 +6,6 @@ import { RealObjectSprite } from './real-object-sprite';
 import { createCanvasTexture } from './texture/canvas-texture';
 export class RealObjectSprite2D extends RealObjectSprite {
     buildMaterial() {
-        var { fillStyle } = this.component.state;
         var material = new THREE.SpriteMaterial({
             map: createCanvasTexture(this.component),
             alphaTest: 0.1

package/dist/threed/real-object-sprite-2d.js.map

@@ -1 +1 @@
-{"version":3,"file":"real-object-sprite-2d.js","sourceRoot":"","sources":["../../src/threed/real-object-sprite-2d.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAA;AACvD,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAA;AAE9D,MAAM,OAAO,kBAAmB,SAAQ,gBAAgB;IACtD,aAAa;QACX,IAAI,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAExC,IAAI,QAAQ,GAAG,IAAI,KAAK,CAAC,cAAc,CAAC;YACtC,GAAG,EAAE,mBAAmB,CAAC,IAAI,CAAC,SAAS,CAAC;YACxC,SAAS,EAAE,GAAG;SACf,CAAC,CAAA;QAEF,QAAQ,CAAC,eAAe,GAAG,KAAK,CAAA;QAEhC,OAAO,QAAQ,CAAA;IACjB,CAAC;IAED,IAAI,KAAK;QACP,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAA;QAC/C,MAAM,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,EAAE,YAAY,EAAE,GAAG,IAAI,CAAC,cAAe,CAAC,MAAM,CAAA;QAChF,MAAM,EAAE,KAAK,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAE1C,OAAO;YACL,CAAC,EAAE,CAAC,KAAK,GAAG,KAAK,CAAC,GAAG,WAAW;YAChC,CAAC,EAAE,CAAC,KAAK,GAAG,MAAM,CAAC,GAAG,YAAY;YAClC,CAAC,EAAE,KAAK;SACT,CAAA;IACH,CAAC;CACF","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport * as THREE from 'three'\nimport { RealObjectSprite } from './real-object-sprite'\nimport { createCanvasTexture } from './texture/canvas-texture'\n\nexport class RealObjectSprite2D extends RealObjectSprite {\n  buildMaterial() {\n    var { fillStyle } = this.component.state\n\n    var material = new THREE.SpriteMaterial({\n      map: createCanvasTexture(this.component),\n      alphaTest: 0.1\n    })\n\n    material.sizeAttenuation = false\n\n    return material\n  }\n\n  get scale() {\n    const { width, height } = this.component.bounds\n    const { width: parentWidth, height: parentHeight } = this.threeContainer!.bounds\n    const { scale = 1 } = this.component.state\n\n    return {\n      x: (scale * width) / parentWidth,\n      y: (scale * height) / parentHeight,\n      z: scale\n    }\n  }\n}\n"]}
+{"version":3,"file":"real-object-sprite-2d.js","sourceRoot":"","sources":["../../src/threed/real-object-sprite-2d.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAA;AACvD,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAA;AAE9D,MAAM,OAAO,kBAAmB,SAAQ,gBAAgB;IACtD,aAAa;QACX,IAAI,QAAQ,GAAG,IAAI,KAAK,CAAC,cAAc,CAAC;YACtC,GAAG,EAAE,mBAAmB,CAAC,IAAI,CAAC,SAAS,CAAC;YACxC,SAAS,EAAE,GAAG;SACf,CAAC,CAAA;QAEF,QAAQ,CAAC,eAAe,GAAG,KAAK,CAAA;QAEhC,OAAO,QAAQ,CAAA;IACjB,CAAC;IAED,IAAI,KAAK;QACP,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAA;QAC/C,MAAM,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,EAAE,YAAY,EAAE,GAAG,IAAI,CAAC,cAAe,CAAC,MAAM,CAAA;QAChF,MAAM,EAAE,KAAK,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAE1C,OAAO;YACL,CAAC,EAAE,CAAC,KAAK,GAAG,KAAK,CAAC,GAAG,WAAW;YAChC,CAAC,EAAE,CAAC,KAAK,GAAG,MAAM,CAAC,GAAG,YAAY;YAClC,CAAC,EAAE,KAAK;SACT,CAAA;IACH,CAAC;CACF","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport * as THREE from 'three'\nimport { RealObjectSprite } from './real-object-sprite'\nimport { createCanvasTexture } from './texture/canvas-texture'\n\nexport class RealObjectSprite2D extends RealObjectSprite {\n  buildMaterial() {\n    var material = new THREE.SpriteMaterial({\n      map: createCanvasTexture(this.component),\n      alphaTest: 0.1\n    })\n\n    material.sizeAttenuation = false\n\n    return material\n  }\n\n  get scale() {\n    const { width, height } = this.component.bounds\n    const { width: parentWidth, height: parentHeight } = this.threeContainer!.bounds\n    const { scale = 1 } = this.component.state\n\n    return {\n      x: (scale * width) / parentWidth,\n      y: (scale * height) / parentHeight,\n      z: scale\n    }\n  }\n}\n"]}

package/dist/threed/real-object-text.d.ts

@@ -1,16 +1,15 @@
 import { RealObjectMesh } from './real-object-mesh';
-import * as THREE from 'three';
 /**
  * RealObjectText
  */
 export declare class RealObjectText extends RealObjectMesh {
-    buildGeometry(): THREE.PlaneGeometry;
-    buildMaterial(): THREE.MeshBasicMaterial;
-    updateDimension(): void;
+    buildGeometry(): void;
     get rotation(): {
         x: number;
         y: any;
         z: any;
     };
+    updateDimension(): void;
+    updateText(): void;
     updateAlpha(): void;
 }

package/dist/threed/real-object-text.js

@@ -1,58 +1,16 @@
 /*
  * Copyright © HatioLab Inc. All rights reserved.
  */
-import { RealObjectMesh } from './real-object-mesh';
 import * as THREE from 'three';
-import { textTexture, textBounds } from './texture/text-texture';
+import { applyAlpha } from './common';
+import { RealObjectMesh } from './real-object-mesh';
+import { textTexture } from './texture/text-texture';
 /**
  * RealObjectText
  */
 export class RealObjectText extends RealObjectMesh {
-    buildGeometry() {
-        // TODO component.text의 heavy한 로직을 반복적으로 실행하지 않도록, 캐싱하자.
-        var { bold = false, italic = false, fontFamily = 'Serif', fontSize = 10, fontColor = 'black' } = this.component.state;
-        var text = this.component.text;
-        let { width, height } = textBounds(text, {
-            bold,
-            italic,
-            fontFamily,
-            fontSize,
-            fontColor
-        });
-        // FIXME
-        // ;(this.component as any).dimension = {
-        //   width,
-        //   height,
-        //   depth: 1
-        // }
-        this.component.setState({
-            width,
-            depth: 1,
-            height
-        });
-        return new THREE.PlaneGeometry(width, height);
-    }
-    buildMaterial() {
-        var { width, height, bold = false, italic = false, fontFamily = 'Serif', fontSize = 10, fontColor = 'black' } = this.component.state;
-        // TODO component.text의 heavy한 로직을 반복적으로 실행하지 않도록, 캐싱하자.
-        var text = this.component.text;
-        return new THREE.MeshBasicMaterial({
-            map: textTexture(text, width, height, {
-                bold,
-                italic,
-                fontFamily,
-                fontSize,
-                fontColor
-            }),
-            transparent: true,
-            alphaTest: 0.2,
-            side: THREE.DoubleSide
-        });
-    }
+    buildGeometry() { }
     /* overide */
-    updateDimension() {
-        // Intentionally do nothing
-    }
     get rotation() {
         const { rotationX = 0, rotationY = 0, rotation = 0 } = this.component.state;
         return {
@@ -61,9 +19,45 @@ export class RealObjectText extends RealObjectMesh {
             z: rotation
         };
     }
+    updateDimension() {
+        var { width, height } = this.component.state;
+        if (this.object3d.geometry) {
+            this.object3d.geometry.dispose();
+        }
+        /* scaling으로 해결되지 않기때문에, 새로 geometry를 만드는 방법을 사용한다 */
+        this.object3d.geometry = new THREE.PlaneGeometry(width, height);
+    }
+    updateText() {
+        var material = this.object3d.material;
+        if (!material) {
+            return;
+        }
+        var { width, height, bold = false, italic = false, fontFamily = 'Serif', fontSize = 10, fontColor = 'black', fillStyle } = this.component.state;
+        var text = this.component.text;
+        const texture = textTexture(text, width, height, {
+            bold,
+            italic,
+            fontFamily,
+            fontSize,
+            fontColor
+        });
+        if (texture) {
+            material.map = texture;
+            texture.needsUpdate = true;
+        }
+        else if (typeof fillStyle == 'string') {
+            if (fillStyle !== 'transparent') {
+                material.color.set(fillStyle);
+            }
+            else {
+                material.opacity = 0;
+            }
+        }
+    }
     updateAlpha() {
         // material의 transparency는 항상 true으로 유지되어야 한다.
-        super.updateAlpha();
+        var { alpha = 1, fontColor } = this.component.state;
+        applyAlpha(this.object3d.material, alpha, fontColor);
         this.object3d.material.transparent = true;
     }
 }

package/dist/threed/real-object-text.js.map

@@ -1 +1 @@
-{"version":3,"file":"real-object-text.js","sourceRoot":"","sources":["../../src/threed/real-object-text.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAA;AAEnD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAA;AAEhE;;GAEG;AACH,MAAM,OAAO,cAAe,SAAQ,cAAc;IAChD,aAAa;QACX,wDAAwD;QACxD,IAAI,EACF,IAAI,GAAG,KAAK,EACZ,MAAM,GAAG,KAAK,EACd,UAAU,GAAG,OAAO,EACpB,QAAQ,GAAG,EAAE,EACb,SAAS,GAAG,OAAO,EACpB,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAExB,IAAI,IAAI,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAA;QAC9B,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,UAAU,CAAC,IAAI,EAAE;YACvC,IAAI;YACJ,MAAM;YACN,UAAU;YACV,QAAQ;YACR,SAAS;SACV,CAAC,CAAA;QAEF,QAAQ;QACR,yCAAyC;QACzC,WAAW;QACX,YAAY;QACZ,aAAa;QACb,IAAI;QACJ,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC;YACtB,KAAK;YACL,KAAK,EAAE,CAAC;YACR,MAAM;SACP,CAAC,CAAA;QAEF,OAAO,IAAI,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE,MAAM,CAAC,CAAA;IAC/C,CAAC;IAED,aAAa;QACX,IAAI,EACF,KAAK,EACL,MAAM,EACN,IAAI,GAAG,KAAK,EACZ,MAAM,GAAG,KAAK,EACd,UAAU,GAAG,OAAO,EACpB,QAAQ,GAAG,EAAE,EACb,SAAS,GAAG,OAAO,EACpB,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAExB,wDAAwD;QACxD,IAAI,IAAI,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAA;QAE9B,OAAO,IAAI,KAAK,CAAC,iBAAiB,CAAC;YACjC,GAAG,EAAE,WAAW,CAAC,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE;gBACpC,IAAI;gBACJ,MAAM;gBACN,UAAU;gBACV,QAAQ;gBACR,SAAS;aACV,CAAC;YACF,WAAW,EAAE,IAAI;YACjB,SAAS,EAAE,GAAG;YACd,IAAI,EAAE,KAAK,CAAC,UAAU;SACvB,CAAC,CAAA;IACJ,CAAC;IAED,aAAa;IACb,eAAe;QACb,2BAA2B;IAC7B,CAAC;IAED,IAAI,QAAQ;QACV,MAAM,EAAE,SAAS,GAAG,CAAC,EAAE,SAAS,GAAG,CAAC,EAAE,QAAQ,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAE3E,OAAO;YACL,CAAC,EAAE,SAAS,GAAG,IAAI,CAAC,EAAE,GAAG,CAAC;YAC1B,CAAC,EAAE,SAAS;YACZ,CAAC,EAAE,QAAQ;SACZ,CAAA;IACH,CAAC;IAED,WAAW;QACT,8CAA8C;QAC9C,KAAK,CAAC,WAAW,EAAE,CAClB;QAAC,IAAI,CAAC,QAAQ,CAAC,QAAgB,CAAC,WAAW,GAAG,IAAI,CAAA;IACrD,CAAC;CACF","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport { RealObjectMesh } from './real-object-mesh'\n\nimport * as THREE from 'three'\n\nimport { textTexture, textBounds } from './texture/text-texture'\n\n/**\n * RealObjectText\n */\nexport class RealObjectText extends RealObjectMesh {\n  buildGeometry() {\n    // TODO component.text의 heavy한 로직을 반복적으로 실행하지 않도록, 캐싱하자.\n    var {\n      bold = false,\n      italic = false,\n      fontFamily = 'Serif',\n      fontSize = 10,\n      fontColor = 'black'\n    } = this.component.state\n\n    var text = this.component.text\n    let { width, height } = textBounds(text, {\n      bold,\n      italic,\n      fontFamily,\n      fontSize,\n      fontColor\n    })\n\n    // FIXME\n    // ;(this.component as any).dimension = {\n    //   width,\n    //   height,\n    //   depth: 1\n    // }\n    this.component.setState({\n      width,\n      depth: 1,\n      height\n    })\n\n    return new THREE.PlaneGeometry(width, height)\n  }\n\n  buildMaterial() {\n    var {\n      width,\n      height,\n      bold = false,\n      italic = false,\n      fontFamily = 'Serif',\n      fontSize = 10,\n      fontColor = 'black'\n    } = this.component.state\n\n    // TODO component.text의 heavy한 로직을 반복적으로 실행하지 않도록, 캐싱하자.\n    var text = this.component.text\n\n    return new THREE.MeshBasicMaterial({\n      map: textTexture(text, width, height, {\n        bold,\n        italic,\n        fontFamily,\n        fontSize,\n        fontColor\n      }),\n      transparent: true,\n      alphaTest: 0.2,\n      side: THREE.DoubleSide\n    })\n  }\n\n  /* overide */\n  updateDimension() {\n    // Intentionally do nothing\n  }\n\n  get rotation() {\n    const { rotationX = 0, rotationY = 0, rotation = 0 } = this.component.state\n\n    return {\n      x: rotationX - Math.PI / 2,\n      y: rotationY,\n      z: rotation\n    }\n  }\n\n  updateAlpha() {\n    // material의 transparency는 항상 true으로 유지되어야 한다.\n    super.updateAlpha()\n    ;(this.object3d.material as any).transparent = true\n  }\n}\n"]}
+{"version":3,"file":"real-object-text.js","sourceRoot":"","sources":["../../src/threed/real-object-text.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAErC,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAA;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAA;AAEpD;;GAEG;AACH,MAAM,OAAO,cAAe,SAAQ,cAAc;IAChD,aAAa,KAAI,CAAC;IAElB,aAAa;IAEb,IAAI,QAAQ;QACV,MAAM,EAAE,SAAS,GAAG,CAAC,EAAE,SAAS,GAAG,CAAC,EAAE,QAAQ,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAE3E,OAAO;YACL,CAAC,EAAE,SAAS,GAAG,IAAI,CAAC,EAAE,GAAG,CAAC;YAC1B,CAAC,EAAE,SAAS;YACZ,CAAC,EAAE,QAAQ;SACZ,CAAA;IACH,CAAC;IAED,eAAe;QACb,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAE5C,IAAI,IAAI,CAAC,QAAQ,CAAC,QAAQ,EAAE;YAC1B,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,OAAO,EAAE,CAAA;SACjC;QAED,qDAAqD;QACrD,IAAI,CAAC,QAAQ,CAAC,QAAQ,GAAG,IAAI,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE,MAAM,CAAC,CAAA;IACjE,CAAC;IAED,UAAU;QACR,IAAI,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,QAAsC,CAAA;QACnE,IAAI,CAAC,QAAQ,EAAE;YACb,OAAM;SACP;QAED,IAAI,EACF,KAAK,EACL,MAAM,EACN,IAAI,GAAG,KAAK,EACZ,MAAM,GAAG,KAAK,EACd,UAAU,GAAG,OAAO,EACpB,QAAQ,GAAG,EAAE,EACb,SAAS,GAAG,OAAO,EACnB,SAAS,EACV,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAExB,IAAI,IAAI,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAA;QAE9B,MAAM,OAAO,GAAG,WAAW,CAAC,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE;YAC/C,IAAI;YACJ,MAAM;YACN,UAAU;YACV,QAAQ;YACR,SAAS;SACV,CAAC,CAAA;QAEF,IAAI,OAAO,EAAE;YACX,QAAQ,CAAC,GAAG,GAAG,OAAO,CAAA;YACtB,OAAO,CAAC,WAAW,GAAG,IAAI,CAAA;SAC3B;aAAM,IAAI,OAAO,SAAS,IAAI,QAAQ,EAAE;YACvC,IAAI,SAAS,KAAK,aAAa,EAAE;gBAC/B,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC,CAAA;aAC9B;iBAAM;gBACL,QAAQ,CAAC,OAAO,GAAG,CAAC,CAAA;aACrB;SACF;IACH,CAAC;IAED,WAAW;QACT,8CAA8C;QAC9C,IAAI,EAAE,KAAK,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAEnD,UAAU,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,EAAE,KAAK,EAAE,SAAS,CAAC,CACnD;QAAC,IAAI,CAAC,QAAQ,CAAC,QAAgB,CAAC,WAAW,GAAG,IAAI,CAAA;IACrD,CAAC;CACF","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport * as THREE from 'three'\nimport { applyAlpha } from './common'\n\nimport { RealObjectMesh } from './real-object-mesh'\nimport { textTexture } from './texture/text-texture'\n\n/**\n * RealObjectText\n */\nexport class RealObjectText extends RealObjectMesh {\n  buildGeometry() {}\n\n  /* overide */\n\n  get rotation() {\n    const { rotationX = 0, rotationY = 0, rotation = 0 } = this.component.state\n\n    return {\n      x: rotationX - Math.PI / 2,\n      y: rotationY,\n      z: rotation\n    }\n  }\n\n  updateDimension() {\n    var { width, height } = this.component.state\n\n    if (this.object3d.geometry) {\n      this.object3d.geometry.dispose()\n    }\n\n    /* scaling으로 해결되지 않기때문에, 새로 geometry를 만드는 방법을 사용한다 */\n    this.object3d.geometry = new THREE.PlaneGeometry(width, height)\n  }\n\n  updateText() {\n    var material = this.object3d.material as THREE.MeshStandardMaterial\n    if (!material) {\n      return\n    }\n\n    var {\n      width,\n      height,\n      bold = false,\n      italic = false,\n      fontFamily = 'Serif',\n      fontSize = 10,\n      fontColor = 'black',\n      fillStyle\n    } = this.component.state\n\n    var text = this.component.text\n\n    const texture = textTexture(text, width, height, {\n      bold,\n      italic,\n      fontFamily,\n      fontSize,\n      fontColor\n    })\n\n    if (texture) {\n      material.map = texture\n      texture.needsUpdate = true\n    } else if (typeof fillStyle == 'string') {\n      if (fillStyle !== 'transparent') {\n        material.color.set(fillStyle)\n      } else {\n        material.opacity = 0\n      }\n    }\n  }\n\n  updateAlpha() {\n    // material의 transparency는 항상 true으로 유지되어야 한다.\n    var { alpha = 1, fontColor } = this.component.state\n\n    applyAlpha(this.object3d.material, alpha, fontColor)\n    ;(this.object3d.material as any).transparent = true\n  }\n}\n"]}

package/dist/threed/real-object.d.ts

@@ -61,5 +61,4 @@ export declare abstract class RealObject<T extends THREE.Object3D = THREE.Object
     updateFillStyle(): void;
     updateText(): void;
     onchange(after: Properties, before: Properties): void;
-    get rebuildingProperties(): string[];
 }

package/dist/threed/real-object.js

@@ -14,6 +14,7 @@ export class RealObject {
                 texture.minFilter = THREE.LinearFilter;
                 texture.encoding = THREE.sRGBEncoding;
                 texture.repeat.set(1, 1);
+                texture.needsUpdate = true;
                 component.invalidate();
             }, e => {
                 console.error(e);
@@ -29,9 +30,13 @@ export class RealObject {
     update() {
         this.clear();
         this.build();
+        this.updateDimension();
         this.updateTransform();
+        this.updateFillStyle();
+        this.updateStrokeStyle();
         this.updateAlpha();
         this.updateHidden();
+        this.updateText();
     }
     getObject3dInstance() {
         return new THREE.Object3D();
@@ -192,7 +197,8 @@ export class RealObject {
         this.object3d.scale.set(Math.max(x, SCALE_MIN), Math.max(y, SCALE_MIN), Math.max(z, SCALE_MIN));
     }
     updateDimension() {
-        this.update();
+        var { width, height, depth } = this.dimension;
+        this.object3d.scale.set(width, height, depth);
     }
     updateAlpha() {
         var { alpha } = this.component.state;
@@ -213,26 +219,19 @@ export class RealObject {
     updateHidden() {
         this.object3d.visible = !this.component.state.hidden;
     }
-    updateStrokeStyle() {
-        this.update();
-    }
-    updateFillStyle() {
-        this.update();
-    }
-    updateText() {
-        this.update();
-    }
+    updateStrokeStyle() { }
+    updateFillStyle() { }
+    updateText() { }
     onchange(after, before) {
-        if (hasProperties(this.rebuildingProperties, after)) {
-            this.update();
-            return;
-        }
         if (hasProperties(['cx', 'cy', 'cz', 'zPos', 'left', 'top'], after)) {
-            this.updateDimension();
+            this.updatePosition();
         }
         if (hasProperties(['width', 'height', 'depth'], after)) {
             this.updateDimension();
         }
+        if (hasProperties(['rotationX', 'rotationY', 'rotation'], after)) {
+            this.updateRotate();
+        }
         if ('scale' in after) {
             this.updateScale();
         }
@@ -252,8 +251,5 @@ export class RealObject {
             this.updateText();
         }
     }
-    get rebuildingProperties() {
-        return ['width', 'height', 'depth', 'fillStyle', 'strokeStyle', 'text', 'path'];
-    }
 }
 //# sourceMappingURL=real-object.js.map

package/dist/threed/real-object.js.map

@@ -1 +1 @@
-{"version":3,"file":"real-object.js","sourceRoot":"","sources":["../../src/threed/real-object.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport * as THREE from 'three'\nimport { Component, Properties, DELTA } from '@hatiolab/things-scene'\n\nimport { SCALE_MIN } from './common'\nimport { ThreeDimensionalContainer } from './three-dimensional-container'\n\nfunction hasProperties(props: string[], obj: object) {\n  return props.findIndex(prop => prop in obj) !== -1\n}\n\nexport abstract class RealObject<T extends THREE.Object3D = THREE.Object3D> {\n  protected _component: Component\n  protected _focused: boolean = false\n\n  public object3d: T\n\n  static buildFillStyleTexture(component: Component) {\n    const { fillStyle } = component.state\n\n    if (typeof fillStyle == 'object' && fillStyle.type == 'pattern' && fillStyle.image) {\n      return new THREE.TextureLoader(THREE.DefaultLoadingManager).load(\n        component.app.url(fillStyle.image),\n        texture => {\n          texture.minFilter = THREE.LinearFilter\n          texture.encoding = THREE.sRGBEncoding\n          texture.repeat.set(1, 1)\n\n          component.invalidate()\n        },\n        e => {\n          console.error(e)\n        }\n      )\n    }\n  }\n\n  constructor(component: Component) {\n    this._component = component\n    this.object3d = this.getObject3dInstance()\n\n    this.component.on('change', this.onchange, this)\n  }\n\n  update() {\n    this.clear()\n    this.build()\n\n    this.updateTransform()\n    this.updateAlpha()\n    this.updateHidden()\n  }\n\n  protected getObject3dInstance(): T {\n    return new THREE.Object3D() as T\n  }\n\n  build() {\n    this.object3d.userData.context = this\n    this.object3d.castShadow = true\n    this.object3d.name = this.component.state.id\n  }\n\n  get component(): Component {\n    return this._component!\n  }\n\n  get threeContainer(): ThreeDimensionalContainer | undefined {\n    var component = this.component\n\n    while (component) {\n      if ('is3dContainer' in component && (component as ThreeDimensionalContainer).is3dContainer()) {\n        return component as ThreeDimensionalContainer\n      }\n      component = component.parent\n    }\n  }\n\n  get focused(): boolean {\n    return this._focused\n  }\n\n  set focused(focused: boolean) {\n    this._focused = focused\n  }\n\n  dispose() {\n    this.component.off('change', this.onchange, this)\n    delete this.component._realObject\n\n    this.clear()\n  }\n\n  clear() {\n    this.object3d.children.slice().forEach((child: any) => {\n      if (child['dispose']) child['dispose']()\n      if (child['geometry'] && child['geometry']['dispose']) child['geometry']['dispose']()\n      if (child['material'] && child['material']['dispose']) child['material']['dispose']()\n      if (child['texture'] && child['texture']['dispose']) child['texture']['dispose']()\n      this.object3d.remove(child)\n    })\n\n    this.object3d.userData = {}\n    return this.object3d.clear()\n  }\n\n  /**\n   * Component의 상태값의 변화를 Object3D에 반영 - translate, rotation, scale\n   */\n  updateTransform() {\n    // var {\n    //   scale: { x: sx = 1, y: sy = 1, z: sz = 1 } = UNIT_SCALE,\n    //   translate: { x: tx = 0, y: ty = 0, z: tz = 0 } = UNIT_TRANSLATE,\n    //   rotate: { x: rx = 0, y: ry = 0, z: rz = 0 } = UNIT_ROTATE\n    // } = this.component.state\n\n    var { x: tx, y: ty, z: tz } = this.position\n    var { x: rx, y: ry, z: rz } = this.rotation\n    var { x: sx, y: sy, z: sz } = this.scale\n\n    this.object3d.position.set(tx, ty, tz)\n    this.object3d.rotation.set(rx, ry, rz)\n    this.object3d.scale.set(Math.max(sx, SCALE_MIN), Math.max(sy, SCALE_MIN), Math.max(sz, SCALE_MIN))\n  }\n\n  get position() {\n    const { x, y, z } = this.center\n    return {\n      x,\n      y: z,\n      z: y\n    }\n  }\n\n  get rotation() {\n    const { rotationX = 0, rotationY = 0, rotation = 0 } = this.component.state\n\n    return {\n      x: rotationX,\n      y: rotationY,\n      z: -rotation\n    }\n  }\n\n  get scale() {\n    const { scale = 1 } = this.component.state\n\n    return {\n      x: scale,\n      y: scale,\n      z: scale\n    }\n  }\n\n  get cx() {\n    var { x = 0 } = this.component.center\n    var { width: parentWidth = 0 } = this.component.parent.bounds\n    var { tx = 0 } = this.component.delta() as DELTA\n\n    return x + tx - parentWidth / 2\n  }\n\n  get cy() {\n    var { y = 0 } = this.component.center\n    var { height: parentHeight = 0 } = this.component.parent.bounds\n    var { ty = 0 } = this.component.delta() as DELTA\n\n    return y + ty - parentHeight / 2\n  }\n\n  get cz() {\n    var { zPos = 0, depth = 1 } = this.component.state\n    var { tz = 0 } = this.component.delta() as DELTA\n\n    return zPos + tz + depth / 2\n  }\n\n  get center() {\n    var { x = 0, y = 0 } = this.component.center\n    var { width: parentWidth = 0, height: parentHeight = 0 } = this.component.parent.bounds\n\n    var { tx = 0, ty = 0, tz = 0 } = this.component.delta() as DELTA\n\n    return {\n      x: x + tx - parentWidth / 2,\n      y: y + ty - parentHeight / 2,\n      z: this.cz\n    }\n  }\n\n  get dimension() {\n    const { width, height } = this.component.bounds\n    const { depth } = this.component.state\n    return {\n      width,\n      height,\n      depth\n    }\n  }\n\n  /**\n   * Object3D 모델의 변화를 Component의 모델값에 반영\n   */\n  // updateTransformReverse() {\n  //   var { rotation, position, scale } = this.object3d\n\n  //   this.component.set({\n  //     rotate: {\n  //       x: rotation.x,\n  //       y: rotation.y,\n  //       z: rotation.z\n  //     },\n  //     translate: {\n  //       x: position.x,\n  //       y: position.y,\n  //       z: position.z\n  //     },\n  //     scale: {\n  //       x: scale.x,\n  //       y: scale.y,\n  //       z: scale.z\n  //     }\n  //   })\n  // }\n\n  /* update functions - 전체적인 rebuilding이 필요하지 않은 update 기능 들임 */\n  updatePosition() {\n    var { x = 0, y = 0, z = 0 } = this.position\n    this.object3d.position.set(x, y, z)\n  }\n\n  updateRotate() {\n    var { x = 0, y = 0, z = 0 } = this.rotation\n    this.object3d.rotation.set(x, y, z)\n  }\n\n  updateScale() {\n    var { x = 1, y = 1, z = 1 } = this.scale\n    this.object3d.scale.set(Math.max(x, SCALE_MIN), Math.max(y, SCALE_MIN), Math.max(z, SCALE_MIN))\n  }\n\n  updateDimension() {\n    this.update()\n  }\n\n  updateAlpha() {\n    var { alpha } = this.component.state\n\n    alpha = alpha == undefined ? 1 : alpha\n\n    this.object3d.traverse((o: any) => {\n      var materials = o.material\n      if (!o.material) return\n\n      if (!Array.isArray(materials)) {\n        materials = [materials]\n      }\n\n      materials.forEach((m: any) => {\n        m.opacity *= alpha\n        m.transparent = alpha < 1\n      })\n    })\n  }\n\n  updateHidden() {\n    this.object3d.visible = !this.component.state.hidden\n  }\n\n  updateStrokeStyle() {\n    this.update()\n  }\n\n  updateFillStyle() {\n    this.update()\n  }\n\n  updateText() {\n    this.update()\n  }\n\n  onchange(after: Properties, before: Properties) {\n    if (hasProperties(this.rebuildingProperties, after)) {\n      this.update()\n      return\n    }\n\n    if (hasProperties(['cx', 'cy', 'cz', 'zPos', 'left', 'top'], after)) {\n      this.updateDimension()\n    }\n\n    if (hasProperties(['width', 'height', 'depth'], after)) {\n      this.updateDimension()\n    }\n\n    if ('scale' in after) {\n      this.updateScale()\n    }\n\n    if ('hidden' in after) {\n      this.updateHidden()\n    }\n\n    if ('alpha' in after) {\n      this.updateAlpha()\n    }\n\n    if ('strokeStyle' in after) {\n      this.updateStrokeStyle()\n    }\n\n    if ('fillStyle' in after) {\n      this.updateFillStyle()\n    }\n\n    if ('text' in after) {\n      this.updateText()\n    }\n  }\n\n  get rebuildingProperties(): string[] {\n    return ['width', 'height', 'depth', 'fillStyle', 'strokeStyle', 'text', 'path']\n  }\n}\n"]}
+{"version":3,"file":"real-object.js","sourceRoot":"","sources":["../../src/threed/real-object.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport * as THREE from 'three'\nimport { Component, Properties, DELTA } from '@hatiolab/things-scene'\n\nimport { SCALE_MIN } from './common'\nimport { ThreeDimensionalContainer } from './three-dimensional-container'\n\nfunction hasProperties(props: string[], obj: object) {\n  return props.findIndex(prop => prop in obj) !== -1\n}\n\nexport abstract class RealObject<T extends THREE.Object3D = THREE.Object3D> {\n  protected _component: Component\n  protected _focused: boolean = false\n\n  public object3d: T\n\n  static buildFillStyleTexture(component: Component) {\n    const { fillStyle } = component.state\n\n    if (typeof fillStyle == 'object' && fillStyle.type == 'pattern' && fillStyle.image) {\n      return new THREE.TextureLoader(THREE.DefaultLoadingManager).load(\n        component.app.url(fillStyle.image),\n        texture => {\n          texture.minFilter = THREE.LinearFilter\n          texture.encoding = THREE.sRGBEncoding\n          texture.repeat.set(1, 1)\n          texture.needsUpdate = true\n\n          component.invalidate()\n        },\n        e => {\n          console.error(e)\n        }\n      )\n    }\n  }\n\n  constructor(component: Component) {\n    this._component = component\n    this.object3d = this.getObject3dInstance()\n\n    this.component.on('change', this.onchange, this)\n  }\n\n  update() {\n    this.clear()\n    this.build()\n\n    this.updateDimension()\n    this.updateTransform()\n    this.updateFillStyle()\n    this.updateStrokeStyle()\n    this.updateAlpha()\n    this.updateHidden()\n    this.updateText()\n  }\n\n  protected getObject3dInstance(): T {\n    return new THREE.Object3D() as T\n  }\n\n  build() {\n    this.object3d.userData.context = this\n    this.object3d.castShadow = true\n    this.object3d.name = this.component.state.id\n  }\n\n  get component(): Component {\n    return this._component!\n  }\n\n  get threeContainer(): ThreeDimensionalContainer | undefined {\n    var component = this.component\n\n    while (component) {\n      if ('is3dContainer' in component && (component as ThreeDimensionalContainer).is3dContainer()) {\n        return component as ThreeDimensionalContainer\n      }\n      component = component.parent\n    }\n  }\n\n  get focused(): boolean {\n    return this._focused\n  }\n\n  set focused(focused: boolean) {\n    this._focused = focused\n  }\n\n  dispose() {\n    this.component.off('change', this.onchange, this)\n    delete this.component._realObject\n\n    this.clear()\n  }\n\n  clear() {\n    this.object3d.children.slice().forEach((child: any) => {\n      if (child['dispose']) child['dispose']()\n      if (child['geometry'] && child['geometry']['dispose']) child['geometry']['dispose']()\n      if (child['material'] && child['material']['dispose']) child['material']['dispose']()\n      if (child['texture'] && child['texture']['dispose']) child['texture']['dispose']()\n      this.object3d.remove(child)\n    })\n\n    this.object3d.userData = {}\n    return this.object3d.clear()\n  }\n\n  /**\n   * Component의 상태값의 변화를 Object3D에 반영 - translate, rotation, scale\n   */\n  updateTransform() {\n    // var {\n    //   scale: { x: sx = 1, y: sy = 1, z: sz = 1 } = UNIT_SCALE,\n    //   translate: { x: tx = 0, y: ty = 0, z: tz = 0 } = UNIT_TRANSLATE,\n    //   rotate: { x: rx = 0, y: ry = 0, z: rz = 0 } = UNIT_ROTATE\n    // } = this.component.state\n\n    var { x: tx, y: ty, z: tz } = this.position\n    var { x: rx, y: ry, z: rz } = this.rotation\n    var { x: sx, y: sy, z: sz } = this.scale\n\n    this.object3d.position.set(tx, ty, tz)\n    this.object3d.rotation.set(rx, ry, rz)\n    this.object3d.scale.set(Math.max(sx, SCALE_MIN), Math.max(sy, SCALE_MIN), Math.max(sz, SCALE_MIN))\n  }\n\n  get position() {\n    const { x, y, z } = this.center\n    return {\n      x,\n      y: z,\n      z: y\n    }\n  }\n\n  get rotation() {\n    const { rotationX = 0, rotationY = 0, rotation = 0 } = this.component.state\n\n    return {\n      x: rotationX,\n      y: rotationY,\n      z: -rotation\n    }\n  }\n\n  get scale() {\n    const { scale = 1 } = this.component.state\n\n    return {\n      x: scale,\n      y: scale,\n      z: scale\n    }\n  }\n\n  get cx() {\n    var { x = 0 } = this.component.center\n    var { width: parentWidth = 0 } = this.component.parent.bounds\n    var { tx = 0 } = this.component.delta() as DELTA\n\n    return x + tx - parentWidth / 2\n  }\n\n  get cy() {\n    var { y = 0 } = this.component.center\n    var { height: parentHeight = 0 } = this.component.parent.bounds\n    var { ty = 0 } = this.component.delta() as DELTA\n\n    return y + ty - parentHeight / 2\n  }\n\n  get cz() {\n    var { zPos = 0, depth = 1 } = this.component.state\n    var { tz = 0 } = this.component.delta() as DELTA\n\n    return zPos + tz + depth / 2\n  }\n\n  get center() {\n    var { x = 0, y = 0 } = this.component.center\n    var { width: parentWidth = 0, height: parentHeight = 0 } = this.component.parent.bounds\n\n    var { tx = 0, ty = 0, tz = 0 } = this.component.delta() as DELTA\n\n    return {\n      x: x + tx - parentWidth / 2,\n      y: y + ty - parentHeight / 2,\n      z: this.cz\n    }\n  }\n\n  get dimension() {\n    const { width, height } = this.component.bounds\n    const { depth } = this.component.state\n    return {\n      width,\n      height,\n      depth\n    }\n  }\n\n  /**\n   * Object3D 모델의 변화를 Component의 모델값에 반영\n   */\n  // updateTransformReverse() {\n  //   var { rotation, position, scale } = this.object3d\n\n  //   this.component.set({\n  //     rotate: {\n  //       x: rotation.x,\n  //       y: rotation.y,\n  //       z: rotation.z\n  //     },\n  //     translate: {\n  //       x: position.x,\n  //       y: position.y,\n  //       z: position.z\n  //     },\n  //     scale: {\n  //       x: scale.x,\n  //       y: scale.y,\n  //       z: scale.z\n  //     }\n  //   })\n  // }\n\n  /* update functions - 전체적인 rebuilding이 필요하지 않은 update 기능 들임 */\n  updatePosition() {\n    var { x = 0, y = 0, z = 0 } = this.position\n    this.object3d.position.set(x, y, z)\n  }\n\n  updateRotate() {\n    var { x = 0, y = 0, z = 0 } = this.rotation\n    this.object3d.rotation.set(x, y, z)\n  }\n\n  updateScale() {\n    var { x = 1, y = 1, z = 1 } = this.scale\n    this.object3d.scale.set(Math.max(x, SCALE_MIN), Math.max(y, SCALE_MIN), Math.max(z, SCALE_MIN))\n  }\n\n  updateDimension() {\n    var { width, height, depth } = this.dimension\n    this.object3d.scale.set(width, height, depth)\n  }\n\n  updateAlpha() {\n    var { alpha } = this.component.state\n\n    alpha = alpha == undefined ? 1 : alpha\n\n    this.object3d.traverse((o: any) => {\n      var materials = o.material\n      if (!o.material) return\n\n      if (!Array.isArray(materials)) {\n        materials = [materials]\n      }\n\n      materials.forEach((m: any) => {\n        m.opacity *= alpha\n        m.transparent = alpha < 1\n      })\n    })\n  }\n\n  updateHidden() {\n    this.object3d.visible = !this.component.state.hidden\n  }\n\n  updateStrokeStyle() {}\n  updateFillStyle() {}\n  updateText() {}\n\n  onchange(after: Properties, before: Properties) {\n    if (hasProperties(['cx', 'cy', 'cz', 'zPos', 'left', 'top'], after)) {\n      this.updatePosition()\n    }\n\n    if (hasProperties(['width', 'height', 'depth'], after)) {\n      this.updateDimension()\n    }\n\n    if (hasProperties(['rotationX', 'rotationY', 'rotation'], after)) {\n      this.updateRotate()\n    }\n\n    if ('scale' in after) {\n      this.updateScale()\n    }\n\n    if ('hidden' in after) {\n      this.updateHidden()\n    }\n\n    if ('alpha' in after) {\n      this.updateAlpha()\n    }\n\n    if ('strokeStyle' in after) {\n      this.updateStrokeStyle()\n    }\n\n    if ('fillStyle' in after) {\n      this.updateFillStyle()\n    }\n\n    if ('text' in after) {\n      this.updateText()\n    }\n  }\n}\n"]}