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

package/dist/threed/real-object.js

@@ -0,0 +1,199 @@
+/*
+ * Copyright © HatioLab Inc. All rights reserved.
+ */
+import * as THREE from 'three';
+import { SCALE_MIN } from './common';
+export default class RealObject {
+    constructor(component) {
+        this._component = component;
+        this.object3d = this.getObject3dInstance();
+        //@ts-ignore
+        this.component.on('change', (after, before) => {
+            this.onchange(after, before);
+        });
+    }
+    update() {
+        this.clear();
+        this.build();
+        this.updateTransform();
+        this.updateAlpha();
+        this.updateHidden();
+    }
+    getObject3dInstance() {
+        return new THREE.Object3D();
+    }
+    build() {
+        this.object3d.userData.context = this;
+        this.object3d.castShadow = true;
+        this.object3d.name = this.component.state.id;
+    }
+    get component() {
+        return this._component;
+    }
+    get threeContainer() {
+        var component = this.component;
+        while (component) {
+            if ('is3dContainer' in component && component.is3dContainer()) {
+                return component;
+            }
+            component = component.parent;
+        }
+    }
+    dispose() {
+        this.clear();
+    }
+    clear() {
+        this.object3d.children.slice().forEach((child) => {
+            if (child['dispose'])
+                child['dispose']();
+            if (child['geometry'] && child['geometry']['dispose'])
+                child['geometry']['dispose']();
+            if (child['material'] && child['material']['dispose'])
+                child['material']['dispose']();
+            if (child['texture'] && child['texture']['dispose'])
+                child['texture']['dispose']();
+            this.object3d.remove(child);
+        });
+        this.object3d.userData = {};
+        return this.object3d.clear();
+    }
+    /**
+     * Component의 상태값의 변화를 Object3D에 반영 - translate, rotation, scale
+     */
+    updateTransform() {
+        // var {
+        //   scale: { x: sx = 1, y: sy = 1, z: sz = 1 } = UNIT_SCALE,
+        //   translate: { x: tx = 0, y: ty = 0, z: tz = 0 } = UNIT_TRANSLATE,
+        //   rotate: { x: rx = 0, y: ry = 0, z: rz = 0 } = UNIT_ROTATE
+        // } = this.component.state
+        var { x: tx, y: ty, z: tz } = this.position;
+        var { x: rx, y: ry, z: rz } = this.rotation;
+        var { x: sx, y: sy, z: sz } = this.scale;
+        this.object3d.position.set(tx, ty, tz);
+        this.object3d.rotation.set(rx, ry, rz);
+        this.object3d.scale.set(Math.max(sx, SCALE_MIN), Math.max(sy, SCALE_MIN), Math.max(sz, SCALE_MIN));
+    }
+    get position() {
+        return {
+            x: this.cx || 0,
+            y: this.cz || 0,
+            z: this.cy || 0
+        };
+    }
+    get rotation() {
+        const { rotationX = 0, rotationY = 0, rotation = 0 } = this.component.state;
+        return {
+            x: rotationX,
+            y: rotationY,
+            z: rotation
+        };
+    }
+    get scale() {
+        const { scale = 1 } = this.component.state;
+        return {
+            x: scale,
+            y: scale,
+            z: scale
+        };
+    }
+    get cx() {
+        var { left = 0, width = 0 } = this.component.bounds;
+        var { width: parentWidth = 0 } = this.component.parent.bounds;
+        return left + width / 2 - parentWidth / 2;
+    }
+    get cy() {
+        var { top = 0, height = 0 } = this.component.bounds;
+        var { height: parentHeight = 0 } = this.component.parent.bounds;
+        return top + height / 2 - parentHeight / 2;
+    }
+    get cz() {
+        var { zPos = 0, depth = 1 } = this.component.state;
+        return zPos + depth / 2;
+    }
+    /**
+     * Object3D 모델의 변화를 Component의 모델값에 반영
+     */
+    // updateTransformReverse() {
+    //   var { rotation, position, scale } = this.object3d
+    //   this.component.set({
+    //     rotate: {
+    //       x: rotation.x,
+    //       y: rotation.y,
+    //       z: rotation.z
+    //     },
+    //     translate: {
+    //       x: position.x,
+    //       y: position.y,
+    //       z: position.z
+    //     },
+    //     scale: {
+    //       x: scale.x,
+    //       y: scale.y,
+    //       z: scale.z
+    //     }
+    //   })
+    // }
+    /* update functions - 전체적인 rebuilding이 필요하지 않은 update 기능 들임 */
+    updatePosition() {
+        var { x = 0, y = 0, z = 0 } = this.position;
+        this.object3d.position.set(x, y, z);
+    }
+    updateRotate() {
+        var { x = 0, y = 0, z = 0 } = this.rotation;
+        this.object3d.rotation.set(x, y, z);
+    }
+    updateScale() {
+        var { x = 1, y = 1, z = 1 } = this.scale;
+        this.object3d.scale.set(Math.max(x, SCALE_MIN), Math.max(y, SCALE_MIN), Math.max(z, SCALE_MIN));
+    }
+    updateDimension() {
+        this.update();
+    }
+    updateAlpha() {
+        var { alpha } = this.component.state;
+        alpha = alpha == undefined ? 1 : alpha;
+        this.object3d.traverse((o) => {
+            var materials = o.material;
+            if (!o.material)
+                return;
+            if (!Array.isArray(materials)) {
+                materials = [materials];
+            }
+            materials.forEach((m) => {
+                m.opacity *= alpha;
+                m.transparent = alpha < 1;
+            });
+        });
+    }
+    updateHidden() {
+        this.object3d.visible = !this.component.state.hidden;
+    }
+    onchange(after, before) {
+        if (hasProperty(this.rebuildingProperties, after)) {
+            this.update();
+            return;
+        }
+        if (hasProperty(['cx', 'cy', 'cz', 'zPos', 'left', 'top'], after)) {
+            this.updateDimension();
+        }
+        if (hasProperty(['width', 'height', 'depth'], after)) {
+            this.updateDimension();
+        }
+        if ('scale' in after) {
+            this.updateScale();
+        }
+        if ('hidden' in after) {
+            this.updateHidden();
+        }
+        if ('alpha' in after) {
+            this.updateAlpha();
+        }
+    }
+    get rebuildingProperties() {
+        return ['width', 'height', 'depth', 'fillStyle', 'strokeStyle', 'text', 'path'];
+    }
+}
+function hasProperty(props, obj) {
+    return props.findIndex(prop => prop in obj) !== -1;
+}
+//# sourceMappingURL=real-object.js.map

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

@@ -0,0 +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 { Component, Properties } from '@hatiolab/things-scene'\nimport * as THREE from 'three'\n\nimport { SCALE_MIN } from './common'\nimport { ThreeDimensionalContainer } from './three-dimensional-container'\n\nexport default abstract class RealObject<T extends THREE.Object3D = THREE.Object3D> {\n  protected _component: Component\n  public object3d: T\n\n  constructor(component: Component) {\n    this._component = component\n    this.object3d = this.getObject3dInstance()\n\n    //@ts-ignore\n    this.component.on('change', (after: Properties, before: Properties) => {\n      this.onchange(after, before)\n    })\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  dispose() {\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    return {\n      x: this.cx || 0,\n      y: this.cz || 0,\n      z: this.cy || 0\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 { left = 0, width = 0 } = this.component.bounds\n    var { width: parentWidth = 0 } = this.component.parent.bounds\n\n    return left + width / 2 - parentWidth / 2\n  }\n\n  get cy() {\n    var { top = 0, height = 0 } = this.component.bounds\n    var { height: parentHeight = 0 } = this.component.parent.bounds\n\n    return top + height / 2 - parentHeight / 2\n  }\n\n  get cz() {\n    var { zPos = 0, depth = 1 } = this.component.state\n\n    return zPos + depth / 2\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  onchange(after: Properties, before: Properties) {\n    if (hasProperty(this.rebuildingProperties, after)) {\n      this.update()\n      return\n    }\n\n    if (hasProperty(['cx', 'cy', 'cz', 'zPos', 'left', 'top'], after)) {\n      this.updateDimension()\n    }\n\n    if (hasProperty(['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\n  get rebuildingProperties(): string[] {\n    return ['width', 'height', 'depth', 'fillStyle', 'strokeStyle', 'text', 'path']\n  }\n}\n\nfunction hasProperty(props: string[], obj: object) {\n  return props.findIndex(prop => prop in obj) !== -1\n}\n"]}

package/dist/threed/texture/text-texture.d.ts

@@ -0,0 +1,8 @@
+import * as THREE from 'three';
+export declare function fontStyle(bold: boolean, italic: boolean, fontSize: number, fontFamily: string): string;
+export declare function drawTextTexture(canvas: HTMLCanvasElement, text: string, textStyle: any): void;
+export declare function textTexture(text: string, width: number, height: number, textStyle: any): THREE.CanvasTexture;
+export declare function textBounds(text: string, textStyle: any): {
+    width: number;
+    height: number;
+};

package/dist/threed/three-dimensional-container.d.ts

@@ -0,0 +1,7 @@
+import { Component } from '@hatiolab/things-scene';
+export interface ThreeDimensionalContainer extends Component {
+    is3dContainer(): boolean;
+    get scene3d(): THREE.Scene | undefined;
+    get renderer3d(): THREE.WebGLRenderer | undefined;
+    get mixer(): THREE.AnimationMixer | undefined;
+}

package/dist/threed/three-dimensional-container.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=three-dimensional-container.js.map

package/dist/threed/three-dimensional-container.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"three-dimensional-container.js","sourceRoot":"","sources":["../../src/threed/three-dimensional-container.ts"],"names":[],"mappings":"","sourcesContent":["import { Component } from '@hatiolab/things-scene'\n\nexport interface ThreeDimensionalContainer extends Component {\n  is3dContainer(): boolean\n  get scene3d(): THREE.Scene | undefined\n  get renderer3d(): THREE.WebGLRenderer | undefined\n  get mixer(): THREE.AnimationMixer | undefined\n}\n"]}

package/dist/threed/utils/bound-uv-generator.d.ts

@@ -0,0 +1,16 @@
+import * as THREE from 'three';
+type ExtrudedOptions = {
+    depth: number;
+};
+export default class BoundUVGenerator {
+    bb?: THREE.Box2;
+    extrudedShape?: THREE.Shape;
+    extrudedOptions?: ExtrudedOptions;
+    setShape({ extrudedShape, extrudedOptions }: {
+        extrudedShape: THREE.Shape;
+        extrudedOptions: ExtrudedOptions;
+    }): void;
+    generateTopUV(geometry: THREE.BufferGeometry, vertices: number[], indexA: number, indexB: number, indexC: number): THREE.Vector2[];
+    generateSideWallUV(geometry: THREE.BufferGeometry, vertices: number[], indexA: number, indexB: number, indexC: number, indexD: number): THREE.Vector2[];
+}
+export {};

package/dist/types.d.ts

@@ -0,0 +1,53 @@
+import Component from './components/component';
+export type Properties = {
+    [key: string]: any;
+};
+type DIMENSION = {
+    x: number;
+    y: number;
+};
+type POSITION = DIMENSION;
+type BOUNDS = {
+    left: number;
+    top: number;
+    width: number;
+    height: number;
+};
+export type ComponentNature = {
+    mutable?: boolean;
+    resizable?: boolean;
+    rotatable?: boolean;
+    properties?: {
+        type: string;
+        label: string;
+        name: string;
+        placeholder?: string;
+        observe?: (this: HTMLElement, value: any) => void;
+        property?: {
+            options?: any;
+            [key: string]: any;
+        } | string;
+    }[];
+    'value-property'?: string;
+    valueProperty?: string;
+    help?: string;
+};
+export type Anchor = {
+    name: string;
+    position: POSITION;
+    bounds?: BOUNDS;
+    inout?: 'in' | 'out' | 'inout';
+    type?: string;
+    multiplicity?: number;
+    draw?: (this: Anchor, context: CanvasRenderingContext2D, component: Component) => void;
+    filter?: (this: Anchor, linkEnd?: LinkEnd) => boolean;
+    template?: any;
+    [prop: string]: any;
+};
+type LinkEnd = {
+    component: Component;
+    anchor: Anchor;
+    position: POSITION;
+    fromto: 'from' | 'to';
+};
+export {};