three-stdlib 2.15.2 → 2.16.1

package/postprocessing/UnrealBloomPass.js

@@ -1,220 +1,328 @@
-"use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const THREE = require("three");
-const Pass = require("./Pass.js");
-const CopyShader = require("../shaders/CopyShader.js");
-const LuminosityHighPassShader = require("../shaders/LuminosityHighPassShader.js");
-var UnrealBloomPass = function(resolution, strength, radius, threshold) {
-  this.strength = strength !== void 0 ? strength : 1;
+import { Vector2, Color, WebGLRenderTarget, UniformsUtils, ShaderMaterial, Vector3, AdditiveBlending, MeshBasicMaterial, LinearFilter, RGBAFormat } from 'three';
+import { FullScreenQuad, Pass } from './Pass.js';
+import { CopyShader } from '../shaders/CopyShader.js';
+import { LuminosityHighPassShader } from '../shaders/LuminosityHighPassShader.js';
+
+/**
+ * UnrealBloomPass is inspired by the bloom pass of Unreal Engine. It creates a
+ * mip map chain of bloom textures and blurs them with different radii. Because
+ * of the weighted combination of mips, and because larger blurs are done on
+ * higher mips, this effect provides good quality and performance.
+ *
+ * Reference:
+ * - https://docs.unrealengine.com/latest/INT/Engine/Rendering/PostProcessEffects/Bloom/
+ */
+
+var UnrealBloomPass = function (resolution, strength, radius, threshold) {
+  this.strength = strength !== undefined ? strength : 1;
   this.radius = radius;
   this.threshold = threshold;
-  this.resolution = resolution !== void 0 ? new THREE.Vector2(resolution.x, resolution.y) : new THREE.Vector2(256, 256);
-  this.clearColor = new THREE.Color(0, 0, 0);
+  this.resolution = resolution !== undefined ? new Vector2(resolution.x, resolution.y) : new Vector2(256, 256); // create color only once here, reuse it later inside the render function
+
+  this.clearColor = new Color(0, 0, 0); // render targets
+
   var pars = {
-    minFilter: THREE.LinearFilter,
-    magFilter: THREE.LinearFilter,
-    format: THREE.RGBAFormat
+    minFilter: LinearFilter,
+    magFilter: LinearFilter,
+    format: RGBAFormat
   };
   this.renderTargetsHorizontal = [];
   this.renderTargetsVertical = [];
   this.nMips = 5;
   var resx = Math.round(this.resolution.x / 2);
   var resy = Math.round(this.resolution.y / 2);
-  this.renderTargetBright = new THREE.WebGLRenderTarget(resx, resy, pars);
-  this.renderTargetBright.texture.name = "UnrealBloomPass.bright";
+  this.renderTargetBright = new WebGLRenderTarget(resx, resy, pars);
+  this.renderTargetBright.texture.name = 'UnrealBloomPass.bright';
   this.renderTargetBright.texture.generateMipmaps = false;
+
   for (let i = 0; i < this.nMips; i++) {
-    var renderTargetHorizonal = new THREE.WebGLRenderTarget(resx, resy, pars);
-    renderTargetHorizonal.texture.name = "UnrealBloomPass.h" + i;
+    var renderTargetHorizonal = new WebGLRenderTarget(resx, resy, pars);
+    renderTargetHorizonal.texture.name = 'UnrealBloomPass.h' + i;
     renderTargetHorizonal.texture.generateMipmaps = false;
     this.renderTargetsHorizontal.push(renderTargetHorizonal);
-    var renderTargetVertical = new THREE.WebGLRenderTarget(resx, resy, pars);
-    renderTargetVertical.texture.name = "UnrealBloomPass.v" + i;
+    var renderTargetVertical = new WebGLRenderTarget(resx, resy, pars);
+    renderTargetVertical.texture.name = 'UnrealBloomPass.v' + i;
     renderTargetVertical.texture.generateMipmaps = false;
     this.renderTargetsVertical.push(renderTargetVertical);
     resx = Math.round(resx / 2);
     resy = Math.round(resy / 2);
-  }
-  if (LuminosityHighPassShader.LuminosityHighPassShader === void 0)
-    console.error("THREE.UnrealBloomPass relies on LuminosityHighPassShader");
-  var highPassShader = LuminosityHighPassShader.LuminosityHighPassShader;
-  this.highPassUniforms = THREE.UniformsUtils.clone(highPassShader.uniforms);
-  this.highPassUniforms["luminosityThreshold"].value = threshold;
-  this.highPassUniforms["smoothWidth"].value = 0.01;
-  this.materialHighPassFilter = new THREE.ShaderMaterial({
+  } // luminosity high pass material
+
+
+  if (LuminosityHighPassShader === undefined) console.error('THREE.UnrealBloomPass relies on LuminosityHighPassShader');
+  var highPassShader = LuminosityHighPassShader;
+  this.highPassUniforms = UniformsUtils.clone(highPassShader.uniforms);
+  this.highPassUniforms['luminosityThreshold'].value = threshold;
+  this.highPassUniforms['smoothWidth'].value = 0.01;
+  this.materialHighPassFilter = new ShaderMaterial({
     uniforms: this.highPassUniforms,
     vertexShader: highPassShader.vertexShader,
     fragmentShader: highPassShader.fragmentShader,
     defines: {}
-  });
+  }); // Gaussian Blur Materials
+
   this.separableBlurMaterials = [];
   var kernelSizeArray = [3, 5, 7, 9, 11];
   var resx = Math.round(this.resolution.x / 2);
   var resy = Math.round(this.resolution.y / 2);
+
   for (let i = 0; i < this.nMips; i++) {
     this.separableBlurMaterials.push(this.getSeperableBlurMaterial(kernelSizeArray[i]));
-    this.separableBlurMaterials[i].uniforms["texSize"].value = new THREE.Vector2(resx, resy);
+    this.separableBlurMaterials[i].uniforms['texSize'].value = new Vector2(resx, resy);
     resx = Math.round(resx / 2);
     resy = Math.round(resy / 2);
-  }
+  } // Composite material
+
+
   this.compositeMaterial = this.getCompositeMaterial(this.nMips);
-  this.compositeMaterial.uniforms["blurTexture1"].value = this.renderTargetsVertical[0].texture;
-  this.compositeMaterial.uniforms["blurTexture2"].value = this.renderTargetsVertical[1].texture;
-  this.compositeMaterial.uniforms["blurTexture3"].value = this.renderTargetsVertical[2].texture;
-  this.compositeMaterial.uniforms["blurTexture4"].value = this.renderTargetsVertical[3].texture;
-  this.compositeMaterial.uniforms["blurTexture5"].value = this.renderTargetsVertical[4].texture;
-  this.compositeMaterial.uniforms["bloomStrength"].value = strength;
-  this.compositeMaterial.uniforms["bloomRadius"].value = 0.1;
+  this.compositeMaterial.uniforms['blurTexture1'].value = this.renderTargetsVertical[0].texture;
+  this.compositeMaterial.uniforms['blurTexture2'].value = this.renderTargetsVertical[1].texture;
+  this.compositeMaterial.uniforms['blurTexture3'].value = this.renderTargetsVertical[2].texture;
+  this.compositeMaterial.uniforms['blurTexture4'].value = this.renderTargetsVertical[3].texture;
+  this.compositeMaterial.uniforms['blurTexture5'].value = this.renderTargetsVertical[4].texture;
+  this.compositeMaterial.uniforms['bloomStrength'].value = strength;
+  this.compositeMaterial.uniforms['bloomRadius'].value = 0.1;
   this.compositeMaterial.needsUpdate = true;
-  var bloomFactors = [1, 0.8, 0.6, 0.4, 0.2];
-  this.compositeMaterial.uniforms["bloomFactors"].value = bloomFactors;
-  this.bloomTintColors = [
-    new THREE.Vector3(1, 1, 1),
-    new THREE.Vector3(1, 1, 1),
-    new THREE.Vector3(1, 1, 1),
-    new THREE.Vector3(1, 1, 1),
-    new THREE.Vector3(1, 1, 1)
-  ];
-  this.compositeMaterial.uniforms["bloomTintColors"].value = this.bloomTintColors;
-  if (CopyShader.CopyShader === void 0) {
-    console.error("THREE.UnrealBloomPass relies on CopyShader");
+  var bloomFactors = [1.0, 0.8, 0.6, 0.4, 0.2];
+  this.compositeMaterial.uniforms['bloomFactors'].value = bloomFactors;
+  this.bloomTintColors = [new Vector3(1, 1, 1), new Vector3(1, 1, 1), new Vector3(1, 1, 1), new Vector3(1, 1, 1), new Vector3(1, 1, 1)];
+  this.compositeMaterial.uniforms['bloomTintColors'].value = this.bloomTintColors; // copy material
+
+  if (CopyShader === undefined) {
+    console.error('THREE.UnrealBloomPass relies on CopyShader');
   }
-  var copyShader = CopyShader.CopyShader;
-  this.copyUniforms = THREE.UniformsUtils.clone(copyShader.uniforms);
-  this.copyUniforms["opacity"].value = 1;
-  this.materialCopy = new THREE.ShaderMaterial({
+
+  var copyShader = CopyShader;
+  this.copyUniforms = UniformsUtils.clone(copyShader.uniforms);
+  this.copyUniforms['opacity'].value = 1.0;
+  this.materialCopy = new ShaderMaterial({
     uniforms: this.copyUniforms,
     vertexShader: copyShader.vertexShader,
     fragmentShader: copyShader.fragmentShader,
-    blending: THREE.AdditiveBlending,
+    blending: AdditiveBlending,
     depthTest: false,
     depthWrite: false,
     transparent: true
   });
   this.enabled = true;
   this.needsSwap = false;
-  this._oldClearColor = new THREE.Color();
+  this._oldClearColor = new Color();
   this.oldClearAlpha = 1;
-  this.basic = new THREE.MeshBasicMaterial();
-  this.fsQuad = new Pass.FullScreenQuad(null);
+  this.basic = new MeshBasicMaterial();
+  this.fsQuad = new FullScreenQuad(null);
 };
-UnrealBloomPass.prototype = Object.assign(Object.create(Pass.Pass.prototype), {
+
+UnrealBloomPass.prototype = Object.assign(Object.create(Pass.prototype), {
   constructor: UnrealBloomPass,
-  dispose: function() {
+  dispose: function () {
     for (let i = 0; i < this.renderTargetsHorizontal.length; i++) {
       this.renderTargetsHorizontal[i].dispose();
     }
+
     for (let i = 0; i < this.renderTargetsVertical.length; i++) {
       this.renderTargetsVertical[i].dispose();
     }
+
     this.renderTargetBright.dispose();
   },
-  setSize: function(width, height) {
+  setSize: function (width, height) {
     var resx = Math.round(width / 2);
     var resy = Math.round(height / 2);
     this.renderTargetBright.setSize(resx, resy);
+
     for (let i = 0; i < this.nMips; i++) {
       this.renderTargetsHorizontal[i].setSize(resx, resy);
       this.renderTargetsVertical[i].setSize(resx, resy);
-      this.separableBlurMaterials[i].uniforms["texSize"].value = new THREE.Vector2(resx, resy);
+      this.separableBlurMaterials[i].uniforms['texSize'].value = new Vector2(resx, resy);
       resx = Math.round(resx / 2);
       resy = Math.round(resy / 2);
     }
   },
-  render: function(renderer, writeBuffer, readBuffer, deltaTime, maskActive) {
+  render: function (renderer, writeBuffer, readBuffer, deltaTime, maskActive) {
     renderer.getClearColor(this._oldClearColor);
     this.oldClearAlpha = renderer.getClearAlpha();
     var oldAutoClear = renderer.autoClear;
     renderer.autoClear = false;
     renderer.setClearColor(this.clearColor, 0);
-    if (maskActive)
-      renderer.state.buffers.stencil.setTest(false);
+    if (maskActive) renderer.state.buffers.stencil.setTest(false); // Render input to screen
+
     if (this.renderToScreen) {
       this.fsQuad.material = this.basic;
       this.basic.map = readBuffer.texture;
       renderer.setRenderTarget(null);
       renderer.clear();
       this.fsQuad.render(renderer);
-    }
-    this.highPassUniforms["tDiffuse"].value = readBuffer.texture;
-    this.highPassUniforms["luminosityThreshold"].value = this.threshold;
+    } // 1. Extract Bright Areas
+
+
+    this.highPassUniforms['tDiffuse'].value = readBuffer.texture;
+    this.highPassUniforms['luminosityThreshold'].value = this.threshold;
     this.fsQuad.material = this.materialHighPassFilter;
     renderer.setRenderTarget(this.renderTargetBright);
     renderer.clear();
-    this.fsQuad.render(renderer);
+    this.fsQuad.render(renderer); // 2. Blur All the mips progressively
+
     var inputRenderTarget = this.renderTargetBright;
+
     for (let i = 0; i < this.nMips; i++) {
       this.fsQuad.material = this.separableBlurMaterials[i];
-      this.separableBlurMaterials[i].uniforms["colorTexture"].value = inputRenderTarget.texture;
-      this.separableBlurMaterials[i].uniforms["direction"].value = UnrealBloomPass.BlurDirectionX;
+      this.separableBlurMaterials[i].uniforms['colorTexture'].value = inputRenderTarget.texture;
+      this.separableBlurMaterials[i].uniforms['direction'].value = UnrealBloomPass.BlurDirectionX;
       renderer.setRenderTarget(this.renderTargetsHorizontal[i]);
       renderer.clear();
       this.fsQuad.render(renderer);
-      this.separableBlurMaterials[i].uniforms["colorTexture"].value = this.renderTargetsHorizontal[i].texture;
-      this.separableBlurMaterials[i].uniforms["direction"].value = UnrealBloomPass.BlurDirectionY;
+      this.separableBlurMaterials[i].uniforms['colorTexture'].value = this.renderTargetsHorizontal[i].texture;
+      this.separableBlurMaterials[i].uniforms['direction'].value = UnrealBloomPass.BlurDirectionY;
       renderer.setRenderTarget(this.renderTargetsVertical[i]);
       renderer.clear();
       this.fsQuad.render(renderer);
       inputRenderTarget = this.renderTargetsVertical[i];
-    }
+    } // Composite All the mips
+
+
     this.fsQuad.material = this.compositeMaterial;
-    this.compositeMaterial.uniforms["bloomStrength"].value = this.strength;
-    this.compositeMaterial.uniforms["bloomRadius"].value = this.radius;
-    this.compositeMaterial.uniforms["bloomTintColors"].value = this.bloomTintColors;
+    this.compositeMaterial.uniforms['bloomStrength'].value = this.strength;
+    this.compositeMaterial.uniforms['bloomRadius'].value = this.radius;
+    this.compositeMaterial.uniforms['bloomTintColors'].value = this.bloomTintColors;
     renderer.setRenderTarget(this.renderTargetsHorizontal[0]);
     renderer.clear();
-    this.fsQuad.render(renderer);
+    this.fsQuad.render(renderer); // Blend it additively over the input texture
+
     this.fsQuad.material = this.materialCopy;
-    this.copyUniforms["tDiffuse"].value = this.renderTargetsHorizontal[0].texture;
-    if (maskActive)
-      renderer.state.buffers.stencil.setTest(true);
+    this.copyUniforms['tDiffuse'].value = this.renderTargetsHorizontal[0].texture;
+    if (maskActive) renderer.state.buffers.stencil.setTest(true);
+
     if (this.renderToScreen) {
       renderer.setRenderTarget(null);
       this.fsQuad.render(renderer);
     } else {
       renderer.setRenderTarget(readBuffer);
       this.fsQuad.render(renderer);
-    }
+    } // Restore renderer settings
+
+
     renderer.setClearColor(this._oldClearColor, this.oldClearAlpha);
     renderer.autoClear = oldAutoClear;
   },
-  getSeperableBlurMaterial: function(kernelRadius) {
-    return new THREE.ShaderMaterial({
+  getSeperableBlurMaterial: function (kernelRadius) {
+    return new ShaderMaterial({
       defines: {
         KERNEL_RADIUS: kernelRadius,
         SIGMA: kernelRadius
       },
       uniforms: {
-        colorTexture: { value: null },
-        texSize: { value: new THREE.Vector2(0.5, 0.5) },
-        direction: { value: new THREE.Vector2(0.5, 0.5) }
+        colorTexture: {
+          value: null
+        },
+        texSize: {
+          value: new Vector2(0.5, 0.5)
+        },
+        direction: {
+          value: new Vector2(0.5, 0.5)
+        }
       },
-      vertexShader: "varying vec2 vUv;\n				void main() {\n					vUv = uv;\n					gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );\n				}",
-      fragmentShader: "#include <common>				varying vec2 vUv;\n				uniform sampler2D colorTexture;\n				uniform vec2 texSize;				uniform vec2 direction;								float gaussianPdf(in float x, in float sigma) {					return 0.39894 * exp( -0.5 * x * x/( sigma * sigma))/sigma;				}				void main() {\n					vec2 invSize = 1.0 / texSize;					float fSigma = float(SIGMA);					float weightSum = gaussianPdf(0.0, fSigma);					vec3 diffuseSum = texture2D( colorTexture, vUv).rgb * weightSum;					for( int i = 1; i < KERNEL_RADIUS; i ++ ) {						float x = float(i);						float w = gaussianPdf(x, fSigma);						vec2 uvOffset = direction * invSize * x;						vec3 sample1 = texture2D( colorTexture, vUv + uvOffset).rgb;						vec3 sample2 = texture2D( colorTexture, vUv - uvOffset).rgb;						diffuseSum += (sample1 + sample2) * w;						weightSum += 2.0 * w;					}					gl_FragColor = vec4(diffuseSum/weightSum, 1.0);\n				}"
+      vertexShader: 'varying vec2 vUv;\n\
+				void main() {\n\
+					vUv = uv;\n\
+					gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );\n\
+				}',
+      fragmentShader: '#include <common>\
+				varying vec2 vUv;\n\
+				uniform sampler2D colorTexture;\n\
+				uniform vec2 texSize;\
+				uniform vec2 direction;\
+				\
+				float gaussianPdf(in float x, in float sigma) {\
+					return 0.39894 * exp( -0.5 * x * x/( sigma * sigma))/sigma;\
+				}\
+				void main() {\n\
+					vec2 invSize = 1.0 / texSize;\
+					float fSigma = float(SIGMA);\
+					float weightSum = gaussianPdf(0.0, fSigma);\
+					vec3 diffuseSum = texture2D( colorTexture, vUv).rgb * weightSum;\
+					for( int i = 1; i < KERNEL_RADIUS; i ++ ) {\
+						float x = float(i);\
+						float w = gaussianPdf(x, fSigma);\
+						vec2 uvOffset = direction * invSize * x;\
+						vec3 sample1 = texture2D( colorTexture, vUv + uvOffset).rgb;\
+						vec3 sample2 = texture2D( colorTexture, vUv - uvOffset).rgb;\
+						diffuseSum += (sample1 + sample2) * w;\
+						weightSum += 2.0 * w;\
+					}\
+					gl_FragColor = vec4(diffuseSum/weightSum, 1.0);\n\
+				}'
     });
   },
-  getCompositeMaterial: function(nMips) {
-    return new THREE.ShaderMaterial({
+  getCompositeMaterial: function (nMips) {
+    return new ShaderMaterial({
       defines: {
         NUM_MIPS: nMips
       },
       uniforms: {
-        blurTexture1: { value: null },
-        blurTexture2: { value: null },
-        blurTexture3: { value: null },
-        blurTexture4: { value: null },
-        blurTexture5: { value: null },
-        dirtTexture: { value: null },
-        bloomStrength: { value: 1 },
-        bloomFactors: { value: null },
-        bloomTintColors: { value: null },
-        bloomRadius: { value: 0 }
+        blurTexture1: {
+          value: null
+        },
+        blurTexture2: {
+          value: null
+        },
+        blurTexture3: {
+          value: null
+        },
+        blurTexture4: {
+          value: null
+        },
+        blurTexture5: {
+          value: null
+        },
+        dirtTexture: {
+          value: null
+        },
+        bloomStrength: {
+          value: 1.0
+        },
+        bloomFactors: {
+          value: null
+        },
+        bloomTintColors: {
+          value: null
+        },
+        bloomRadius: {
+          value: 0.0
+        }
       },
-      vertexShader: "varying vec2 vUv;\n				void main() {\n					vUv = uv;\n					gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );\n				}",
-      fragmentShader: "varying vec2 vUv;				uniform sampler2D blurTexture1;				uniform sampler2D blurTexture2;				uniform sampler2D blurTexture3;				uniform sampler2D blurTexture4;				uniform sampler2D blurTexture5;				uniform sampler2D dirtTexture;				uniform float bloomStrength;				uniform float bloomRadius;				uniform float bloomFactors[NUM_MIPS];				uniform vec3 bloomTintColors[NUM_MIPS];								float lerpBloomFactor(const in float factor) { 					float mirrorFactor = 1.2 - factor;					return mix(factor, mirrorFactor, bloomRadius);				}								void main() {					gl_FragColor = bloomStrength * ( lerpBloomFactor(bloomFactors[0]) * vec4(bloomTintColors[0], 1.0) * texture2D(blurTexture1, vUv) + 													 lerpBloomFactor(bloomFactors[1]) * vec4(bloomTintColors[1], 1.0) * texture2D(blurTexture2, vUv) + 													 lerpBloomFactor(bloomFactors[2]) * vec4(bloomTintColors[2], 1.0) * texture2D(blurTexture3, vUv) + 													 lerpBloomFactor(bloomFactors[3]) * vec4(bloomTintColors[3], 1.0) * texture2D(blurTexture4, vUv) + 													 lerpBloomFactor(bloomFactors[4]) * vec4(bloomTintColors[4], 1.0) * texture2D(blurTexture5, vUv) );				}"
+      vertexShader: 'varying vec2 vUv;\n\
+				void main() {\n\
+					vUv = uv;\n\
+					gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );\n\
+				}',
+      fragmentShader: 'varying vec2 vUv;\
+				uniform sampler2D blurTexture1;\
+				uniform sampler2D blurTexture2;\
+				uniform sampler2D blurTexture3;\
+				uniform sampler2D blurTexture4;\
+				uniform sampler2D blurTexture5;\
+				uniform sampler2D dirtTexture;\
+				uniform float bloomStrength;\
+				uniform float bloomRadius;\
+				uniform float bloomFactors[NUM_MIPS];\
+				uniform vec3 bloomTintColors[NUM_MIPS];\
+				\
+				float lerpBloomFactor(const in float factor) { \
+					float mirrorFactor = 1.2 - factor;\
+					return mix(factor, mirrorFactor, bloomRadius);\
+				}\
+				\
+				void main() {\
+					gl_FragColor = bloomStrength * ( lerpBloomFactor(bloomFactors[0]) * vec4(bloomTintColors[0], 1.0) * texture2D(blurTexture1, vUv) + \
+													 lerpBloomFactor(bloomFactors[1]) * vec4(bloomTintColors[1], 1.0) * texture2D(blurTexture2, vUv) + \
+													 lerpBloomFactor(bloomFactors[2]) * vec4(bloomTintColors[2], 1.0) * texture2D(blurTexture3, vUv) + \
+													 lerpBloomFactor(bloomFactors[3]) * vec4(bloomTintColors[3], 1.0) * texture2D(blurTexture4, vUv) + \
+													 lerpBloomFactor(bloomFactors[4]) * vec4(bloomTintColors[4], 1.0) * texture2D(blurTexture5, vUv) );\
+				}'
     });
   }
 });
-UnrealBloomPass.BlurDirectionX = new THREE.Vector2(1, 0);
-UnrealBloomPass.BlurDirectionY = new THREE.Vector2(0, 1);
-exports.UnrealBloomPass = UnrealBloomPass;
+UnrealBloomPass.BlurDirectionX = new Vector2(1.0, 0.0);
+UnrealBloomPass.BlurDirectionY = new Vector2(0.0, 1.0);
+
+export { UnrealBloomPass };

package/renderers/CSS2DRenderer.cjs.js

@@ -0,0 +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)}};

package/renderers/CSS2DRenderer.js

@@ -1,112 +1,124 @@
-"use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const THREE = require("three");
-var CSS2DObject = function(element) {
-  THREE.Object3D.call(this);
-  this.element = element || document.createElement("div");
-  this.element.style.position = "absolute";
-  this.addEventListener("removed", function() {
-    this.traverse(function(object) {
+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);
       }
     });
   });
 };
-CSS2DObject.prototype = Object.assign(Object.create(THREE.Object3D.prototype), {
+
+CSS2DObject.prototype = Object.assign(Object.create(Object3D.prototype), {
   constructor: CSS2DObject,
-  copy: function(source, recursive) {
-    THREE.Object3D.prototype.copy.call(this, source, recursive);
+  copy: function (source, recursive) {
+    Object3D.prototype.copy.call(this, source, recursive);
     this.element = source.element.cloneNode(true);
     return this;
   }
-});
-var CSS2DRenderer = function() {
+}); //
+
+var CSS2DRenderer = function () {
   var _this = this;
+
   var _width, _height;
+
   var _widthHalf, _heightHalf;
-  var vector = new THREE.Vector3();
-  var viewMatrix = new THREE.Matrix4();
-  var viewProjectionMatrix = new THREE.Matrix4();
+
+  var vector = new Vector3();
+  var viewMatrix = new Matrix4();
+  var viewProjectionMatrix = new Matrix4();
   var cache = {
-    objects: /* @__PURE__ */ new WeakMap()
+    objects: new WeakMap()
   };
-  var domElement = document.createElement("div");
-  domElement.style.overflow = "hidden";
+  var domElement = document.createElement('div');
+  domElement.style.overflow = 'hidden';
   this.domElement = domElement;
-  this.getSize = function() {
+
+  this.getSize = function () {
     return {
       width: _width,
       height: _height
     };
   };
-  this.setSize = function(width, height) {
+
+  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";
+    domElement.style.width = width + 'px';
+    domElement.style.height = height + 'px';
   };
-  var renderObject = function(object, scene, camera) {
+
+  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";
+      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)
       };
       cache.objects.set(object, objectData);
+
       if (element.parentNode !== domElement) {
         domElement.appendChild(element);
       }
+
       object.onAfterRender(_this, scene, camera);
     }
+
     for (let i = 0, l = object.children.length; i < l; i++) {
       renderObject(object.children[i], scene, camera);
     }
   };
-  var getDistanceToSquared = function() {
-    var a = new THREE.Vector3();
-    var b = new THREE.Vector3();
-    return function(object1, object2) {
+
+  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 filterAndFlatten = function (scene) {
     var result = [];
-    scene.traverse(function(object) {
-      if (object instanceof CSS2DObject)
-        result.push(object);
+    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 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;
+
     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();
+
+  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);
   };
 };
-exports.CSS2DObject = CSS2DObject;
-exports.CSS2DRenderer = CSS2DRenderer;
+
+export { CSS2DObject, CSS2DRenderer };

package/renderers/CSS3DRenderer.cjs.js

@@ -0,0 +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.element.style.pointerEvents="auto",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,r){return e.Object3D.prototype.copy.call(this,t,r),this.element=t.element.cloneNode(!0),this}});var r=function(e){t.call(this,e)};(r.prototype=Object.create(t.prototype)).constructor=r;exports.CSS3DObject=t,exports.CSS3DRenderer=function(){var n,o,s,a,i=this,l=new e.Matrix4,c={camera:{fov:0,style:""},objects:new WeakMap},p=document.createElement("div");p.style.overflow="hidden",this.domElement=p;var d=document.createElement("div");function m(e){return Math.abs(e)<1e-10?0:e}function h(e){var t=e.elements;return"matrix3d("+m(t[0])+","+m(-t[1])+","+m(t[2])+","+m(t[3])+","+m(t[4])+","+m(-t[5])+","+m(t[6])+","+m(t[7])+","+m(t[8])+","+m(-t[9])+","+m(t[10])+","+m(t[11])+","+m(t[12])+","+m(-t[13])+","+m(t[14])+","+m(t[15])+")"}function u(e){var t=e.elements;return"translate(-50%,-50%)"+("matrix3d("+m(t[0])+","+m(t[1])+","+m(t[2])+","+m(t[3])+","+m(-t[4])+","+m(-t[5])+","+m(-t[6])+","+m(-t[7])+","+m(t[8])+","+m(t[9])+","+m(t[10])+","+m(t[11])+","+m(t[12])+","+m(t[13])+","+m(t[14])+","+m(t[15])+")")}function v(e,n,o,s){if(e instanceof t){var a;e.onBeforeRender(i,n,o),e instanceof r?(l.copy(o.matrixWorldInverse),l.transpose(),l.copyPosition(e.matrixWorld),l.scale(e.scale),l.elements[3]=0,l.elements[7]=0,l.elements[11]=0,l.elements[15]=1,a=u(l)):a=u(e.matrixWorld);var p=e.element,m=c.objects.get(e);if(void 0===m||m.style!==a){p.style.transform=a;var h={style:a};c.objects.set(e,h)}p.style.display=e.visible?"":"none",p.parentNode!==d&&d.appendChild(p),e.onAfterRender(i,n,o)}for(let t=0,r=e.children.length;t<r;t++)v(e.children[t],n,o)}d.style.transformStyle="preserve-3d",d.style.pointerEvents="none",p.appendChild(d),this.getSize=function(){return{width:n,height:o}},this.setSize=function(e,t){s=(n=e)/2,a=(o=t)/2,p.style.width=e+"px",p.style.height=t+"px",d.style.width=e+"px",d.style.height=t+"px"},this.render=function(e,t){var r=t.projectionMatrix.elements[5]*a;if(c.camera.fov!==r&&(p.style.perspective=t.isPerspectiveCamera?r+"px":"",c.camera.fov=r),!0===e.autoUpdate&&e.updateMatrixWorld(),null===t.parent&&t.updateMatrixWorld(),t.isOrthographicCamera)var n=-(t.right+t.left)/2,o=(t.top+t.bottom)/2;var i=(t.isOrthographicCamera?"scale("+r+")translate("+m(n)+"px,"+m(o)+"px)"+h(t.matrixWorldInverse):"translateZ("+r+"px)"+h(t.matrixWorldInverse))+"translate("+s+"px,"+a+"px)";c.camera.style!==i&&(d.style.transform=i,c.camera.style=i),v(e,e,t)}},exports.CSS3DSprite=r;