three-stdlib 2.20.4 → 2.20.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "three-stdlib",
-  "version": "2.20.4",
+  "version": "2.20.5",
   "private": false,
   "description": "stand-alone library of threejs examples",
   "main": "index.cjs.js",

package/renderers/CSS2DRenderer.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("three"),t=function(t){e.Object3D.call(this),this.element=t||document.createElement("div"),this.element.style.position="absolute",this.addEventListener("removed",(function(){this.traverse((function(e){e.element instanceof Element&&null!==e.element.parentNode&&e.element.parentNode.removeChild(e.element)}))}))};t.prototype=Object.assign(Object.create(e.Object3D.prototype),{constructor:t,copy:function(t,n){return e.Object3D.prototype.copy.call(this,t,n),this.element=t.element.cloneNode(!0),this}});exports.CSS2DObject=t,exports.CSS2DRenderer=function(){var n,r,o,i,a=this,s=new e.Vector3,l=new e.Matrix4,c=new e.Matrix4,d={objects:new WeakMap},u=document.createElement("div");u.style.overflow="hidden",this.domElement=u,this.getSize=function(){return{width:n,height:r}},this.setSize=function(e,t){o=(n=e)/2,i=(r=t)/2,u.style.width=e+"px",u.style.height=t+"px"};var p,m,h=function(e,n,r){if(e instanceof t){e.onBeforeRender(a,n,r),s.setFromMatrixPosition(e.matrixWorld),s.applyMatrix4(c);var l=e.element;l.style.transform="translate(-50%,-50%) translate("+(s.x*o+o)+"px,"+(-s.y*i+i)+"px)",l.style.display=e.visible&&s.z>=-1&&s.z<=1?"":"none";var p={distanceToCameraSquared:f(r,e)};d.objects.set(e,p),l.parentNode!==u&&u.appendChild(l),e.onAfterRender(a,n,r)}for(let t=0,o=e.children.length;t<o;t++)h(e.children[t],n,r)},f=(p=new e.Vector3,m=new e.Vector3,function(e,t){return p.setFromMatrixPosition(e.matrixWorld),m.setFromMatrixPosition(t.matrixWorld),p.distanceToSquared(m)}),x=function(e){var n=function(e){var n=[];return e.traverse((function(e){e instanceof t&&n.push(e)})),n}(e).sort((function(e,t){return d.objects.get(e).distanceToCameraSquared-d.objects.get(t).distanceToCameraSquared})),r=n.length;for(let e=0,t=n.length;e<t;e++)n[e].element.style.zIndex=r-e};this.render=function(e,t){!0===e.autoUpdate&&e.updateMatrixWorld(),null===t.parent&&t.updateMatrixWorld(),l.copy(t.matrixWorldInverse),c.multiplyMatrices(t.projectionMatrix,l),h(e,e,t),x(e)}};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("three");class t extends e.Object3D{constructor(e=document.createElement("div")){super(),this.isCSS2DObject=!0,this.element=e,this.element.style.position="absolute",this.element.style.userSelect="none",this.element.setAttribute("draggable",!1),this.addEventListener("removed",(function(){this.traverse((function(e){e.element instanceof Element&&null!==e.element.parentNode&&e.element.parentNode.removeChild(e.element)}))}))}copy(e,t){return super.copy(e,t),this.element=e.element.cloneNode(!0),this}}const r=new e.Vector3,n=new e.Matrix4,o=new e.Matrix4,i=new e.Vector3,s=new e.Vector3;exports.CSS2DObject=t,exports.CSS2DRenderer=class{constructor(e={}){const t=this;let l,a,d,c;const u={objects:new WeakMap},m=void 0!==e.element?e.element:document.createElement("div");function p(e,n,i){if(e.isCSS2DObject){r.setFromMatrixPosition(e.matrixWorld),r.applyMatrix4(o);const s=!0===e.visible&&r.z>=-1&&r.z<=1&&!0===e.layers.test(i.layers);if(e.element.style.display=!0===s?"":"none",!0===s){e.onBeforeRender(t,n,i);const o=e.element;o.style.transform="translate(-50%,-50%) translate("+(r.x*d+d)+"px,"+(-r.y*c+c)+"px)",o.parentNode!==m&&m.appendChild(o),e.onAfterRender(t,n,i)}const l={distanceToCameraSquared:h(i,e)};u.objects.set(e,l)}for(let t=0,r=e.children.length;t<r;t++)p(e.children[t],n,i)}function h(e,t){return i.setFromMatrixPosition(e.matrixWorld),s.setFromMatrixPosition(t.matrixWorld),i.distanceToSquared(s)}m.style.overflow="hidden",this.domElement=m,this.getSize=function(){return{width:l,height:a}},this.render=function(e,t){!0!==e.matrixWorldAutoUpdate&&!0!==e.autoUpdate||e.updateMatrixWorld(),null!==t.parent||null!=t.matrixWorldAutoUpdate&&!0!==t.matrixWorldAutoUpdate||t.updateMatrixWorld(),n.copy(t.matrixWorldInverse),o.multiplyMatrices(t.projectionMatrix,n),p(e,e,t),function(e){const t=function(e){const t=[];return e.traverse((function(e){e.isCSS2DObject&&t.push(e)})),t}(e).sort((function(e,t){if(e.renderOrder!==t.renderOrder)return t.renderOrder-e.renderOrder;return u.objects.get(e).distanceToCameraSquared-u.objects.get(t).distanceToCameraSquared})),r=t.length;for(let e=0,n=t.length;e<n;e++)t[e].element.style.zIndex=r-e}(e)},this.setSize=function(e,t){l=e,a=t,d=l/2,c=a/2,m.style.width=e+"px",m.style.height=t+"px"}}};

package/renderers/CSS2DRenderer.js

@@ -1,124 +1,149 @@
 import { Object3D, Vector3, Matrix4 } from 'three';
 
-var CSS2DObject = function (element) {
-  Object3D.call(this);
-  this.element = element || document.createElement('div');
-  this.element.style.position = 'absolute';
-  this.addEventListener('removed', function () {
-    this.traverse(function (object) {
-      if (object.element instanceof Element && object.element.parentNode !== null) {
-        object.element.parentNode.removeChild(object.element);
-      }
+class CSS2DObject extends Object3D {
+  constructor(element = document.createElement('div')) {
+    super();
+    this.isCSS2DObject = true;
+    this.element = element;
+    this.element.style.position = 'absolute';
+    this.element.style.userSelect = 'none';
+    this.element.setAttribute('draggable', false);
+    this.addEventListener('removed', function () {
+      this.traverse(function (object) {
+        if (object.element instanceof Element && object.element.parentNode !== null) {
+          object.element.parentNode.removeChild(object.element);
+        }
+      });
     });
-  });
-};
+  }
 
-CSS2DObject.prototype = Object.assign(Object.create(Object3D.prototype), {
-  constructor: CSS2DObject,
-  copy: function (source, recursive) {
-    Object3D.prototype.copy.call(this, source, recursive);
+  copy(source, recursive) {
+    super.copy(source, recursive);
     this.element = source.element.cloneNode(true);
     return this;
   }
-}); //
 
-var CSS2DRenderer = function () {
-  var _this = this;
+}
+
+const _vector = /*#__PURE__*/new Vector3();
+
+const _viewMatrix = /*#__PURE__*/new Matrix4();
+
+const _viewProjectionMatrix = /*#__PURE__*/new Matrix4();
 
-  var _width, _height;
+const _a = /*#__PURE__*/new Vector3();
 
-  var _widthHalf, _heightHalf;
+const _b = /*#__PURE__*/new Vector3();
 
-  var vector = new Vector3();
-  var viewMatrix = new Matrix4();
-  var viewProjectionMatrix = new Matrix4();
-  var cache = {
-    objects: new WeakMap()
-  };
-  var domElement = document.createElement('div');
-  domElement.style.overflow = 'hidden';
-  this.domElement = domElement;
+class CSS2DRenderer {
+  constructor(parameters = {}) {
+    const _this = this;
 
-  this.getSize = function () {
-    return {
-      width: _width,
-      height: _height
+    let _width, _height;
+
+    let _widthHalf, _heightHalf;
+
+    const cache = {
+      objects: new WeakMap()
     };
-  };
-
-  this.setSize = function (width, height) {
-    _width = width;
-    _height = height;
-    _widthHalf = _width / 2;
-    _heightHalf = _height / 2;
-    domElement.style.width = width + 'px';
-    domElement.style.height = height + 'px';
-  };
-
-  var renderObject = function (object, scene, camera) {
-    if (object instanceof CSS2DObject) {
-      object.onBeforeRender(_this, scene, camera);
-      vector.setFromMatrixPosition(object.matrixWorld);
-      vector.applyMatrix4(viewProjectionMatrix);
-      var element = object.element;
-      element.style.transform = 'translate(-50%,-50%) translate(' + (vector.x * _widthHalf + _widthHalf) + 'px,' + (-vector.y * _heightHalf + _heightHalf) + 'px)';
-      element.style.display = object.visible && vector.z >= -1 && vector.z <= 1 ? '' : 'none';
-      var objectData = {
-        distanceToCameraSquared: getDistanceToSquared(camera, object)
+    const domElement = parameters.element !== undefined ? parameters.element : document.createElement('div');
+    domElement.style.overflow = 'hidden';
+    this.domElement = domElement;
+
+    this.getSize = function () {
+      return {
+        width: _width,
+        height: _height
       };
-      cache.objects.set(object, objectData);
+    };
+
+    this.render = function (scene, camera) {
+      if (scene.matrixWorldAutoUpdate === true || scene.autoUpdate === true) scene.updateMatrixWorld();
+      if (camera.parent === null && (camera.matrixWorldAutoUpdate == null || camera.matrixWorldAutoUpdate === true)) camera.updateMatrixWorld();
+
+      _viewMatrix.copy(camera.matrixWorldInverse);
+
+      _viewProjectionMatrix.multiplyMatrices(camera.projectionMatrix, _viewMatrix);
+
+      renderObject(scene, scene, camera);
+      zOrder(scene);
+    };
+
+    this.setSize = function (width, height) {
+      _width = width;
+      _height = height;
+      _widthHalf = _width / 2;
+      _heightHalf = _height / 2;
+      domElement.style.width = width + 'px';
+      domElement.style.height = height + 'px';
+    };
+
+    function renderObject(object, scene, camera) {
+      if (object.isCSS2DObject) {
+        _vector.setFromMatrixPosition(object.matrixWorld);
+
+        _vector.applyMatrix4(_viewProjectionMatrix);
 
-      if (element.parentNode !== domElement) {
-        domElement.appendChild(element);
+        const visible = object.visible === true && _vector.z >= -1 && _vector.z <= 1 && object.layers.test(camera.layers) === true;
+        object.element.style.display = visible === true ? '' : 'none';
+
+        if (visible === true) {
+          object.onBeforeRender(_this, scene, camera);
+          const element = object.element;
+          element.style.transform = 'translate(-50%,-50%) translate(' + (_vector.x * _widthHalf + _widthHalf) + 'px,' + (-_vector.y * _heightHalf + _heightHalf) + 'px)';
+
+          if (element.parentNode !== domElement) {
+            domElement.appendChild(element);
+          }
+
+          object.onAfterRender(_this, scene, camera);
+        }
+
+        const objectData = {
+          distanceToCameraSquared: getDistanceToSquared(camera, object)
+        };
+        cache.objects.set(object, objectData);
       }
 
-      object.onAfterRender(_this, scene, camera);
+      for (let i = 0, l = object.children.length; i < l; i++) {
+        renderObject(object.children[i], scene, camera);
+      }
     }
 
-    for (let i = 0, l = object.children.length; i < l; i++) {
-      renderObject(object.children[i], scene, camera);
+    function getDistanceToSquared(object1, object2) {
+      _a.setFromMatrixPosition(object1.matrixWorld);
+
+      _b.setFromMatrixPosition(object2.matrixWorld);
+
+      return _a.distanceToSquared(_b);
     }
-  };
-
-  var getDistanceToSquared = function () {
-    var a = new Vector3();
-    var b = new Vector3();
-    return function (object1, object2) {
-      a.setFromMatrixPosition(object1.matrixWorld);
-      b.setFromMatrixPosition(object2.matrixWorld);
-      return a.distanceToSquared(b);
-    };
-  }();
 
-  var filterAndFlatten = function (scene) {
-    var result = [];
-    scene.traverse(function (object) {
-      if (object instanceof CSS2DObject) result.push(object);
-    });
-    return result;
-  };
-
-  var zOrder = function (scene) {
-    var sorted = filterAndFlatten(scene).sort(function (a, b) {
-      var distanceA = cache.objects.get(a).distanceToCameraSquared;
-      var distanceB = cache.objects.get(b).distanceToCameraSquared;
-      return distanceA - distanceB;
-    });
-    var zMax = sorted.length;
+    function filterAndFlatten(scene) {
+      const result = [];
+      scene.traverse(function (object) {
+        if (object.isCSS2DObject) result.push(object);
+      });
+      return result;
+    }
+
+    function zOrder(scene) {
+      const sorted = filterAndFlatten(scene).sort(function (a, b) {
+        if (a.renderOrder !== b.renderOrder) {
+          return b.renderOrder - a.renderOrder;
+        }
 
-    for (let i = 0, l = sorted.length; i < l; i++) {
-      sorted[i].element.style.zIndex = zMax - i;
+        const distanceA = cache.objects.get(a).distanceToCameraSquared;
+        const distanceB = cache.objects.get(b).distanceToCameraSquared;
+        return distanceA - distanceB;
+      });
+      const zMax = sorted.length;
+
+      for (let i = 0, l = sorted.length; i < l; i++) {
+        sorted[i].element.style.zIndex = zMax - i;
+      }
     }
-  };
-
-  this.render = function (scene, camera) {
-    if (scene.autoUpdate === true) scene.updateMatrixWorld();
-    if (camera.parent === null) camera.updateMatrixWorld();
-    viewMatrix.copy(camera.matrixWorldInverse);
-    viewProjectionMatrix.multiplyMatrices(camera.projectionMatrix, viewMatrix);
-    renderObject(scene, scene, camera);
-    zOrder(scene);
-  };
-};
+  }
+
+}
 
 export { CSS2DObject, CSS2DRenderer };