three-devtools/src/content/DevToolsScene.js at master · threejs/three-devtools · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
export default (THREE) => {

/**
 * `THREE` in this context is the devtools own version of three
 * injected into this scope only.
 */
return class DevToolsScene extends THREE.Scene {
  constructor(target, domElement, camera) {
    super();
    this.onSelectedObjectRemove = this.onSelectedObjectRemove.bind(this);
    this.name = 'DevToolsScene';
    this.bbHelper = new THREE.BoxHelper();
    window.bbHelper = this.bbHelper;
    this.bbHelper.material.depthWrite = false;
    this.bbHelper.material.depthTest = false;
    this.bbHelper.visible = false;
    this.add(this.bbHelper);

    this.target = target;
    this.camera = camera;
    this.domElement = domElement;
    this.transformControls = new THREE.TransformControls(camera, domElement);
    this.transformControls.space = 'local';
    this.add(this.transformControls);

    utils.hideObjectFromTools(this);
    utils.hideObjectFromTools(this.bbHelper);
    utils.hideObjectFromTools(this.transformControls);

    this.transformControls.addEventListener('change', e => {
      // Fire an event to __THREE_DEVTOOLS__ so that content
      // can handle lazy rendering, indicating a rerender is necessary.
      this.target.dispatchEvent(new CustomEvent('visualization-change'));
    });

    this.transformControls.addEventListener('dragging-changed', e => {
      this.target.dispatchEvent(new CustomEvent('interaction-change', {
        detail: {
          active: e.value,
        },
      }));
    });
  }

  setTransformMode(mode) {
    if (mode && this.transformControls.mode !== mode) {
      this.transformControls.mode = mode;
    }
  }

  toggleTransformSpace() {
    const space = this.transformControls.space;
    this.transformControls.space = space === 'world' ? 'local' : 'world';
  }

  setCamera(camera) {
    this.camera = camera;
    this.transformControls.camera = camera;
  }

  selectObject(object) {
    if (this.selectedObject) {
      this.selectedObject.removeEventListener('removed', this.onSelectedObjectRemove);
      this.transformControls.detach();
    }

    this.selectedObject = object;
    this.bbHelper.visible = false;

    if (object && object.isObject3D && !object.isScene) {
      this.transformControls.attach(object);
      object.addEventListener('removed', this.onSelectedObjectRemove);
    }

    if (object) {
      const currentBBVersion = this.bbHelper.geometry.attributes.position.version;
      this.bbHelper.setFromObject(object);
      // Only way to determine if the object's bounding box is empty
      // or not without recomputing
      if (currentBBVersion !== this.bbHelper.geometry.attributes.position.version) {
        this.bbHelper.visible = true;
      }
    }

    this.target.dispatchEvent(new CustomEvent('visualization-change'));
  }

  onBeforeRender() {
    if (this.bbHelper.visible) {
      this.bbHelper.update();
    }
  }

  onSelectedObjectRemove() {
    this.selectObject(null);
  }
}
};