opal-js_wrap-three 0.1.1 → 0.1.2

data/lib-opal/js_wrap/three/csm/CSM.js

@@ -0,0 +1,346 @@
+(function (global, factory) {
+  if (typeof define === "function" && define.amd) {
+    define(["exports", "three", "./CSMFrustum.js", "./CSMShader.js"], factory);
+  } else if (typeof exports !== "undefined") {
+    factory(exports, require("three"), require("./CSMFrustum.js"), require("./CSMShader.js"));
+  } else {
+    var mod = {
+      exports: {}
+    };
+    factory(mod.exports, global.three, global.CSMFrustum, global.CSMShader);
+    global.CSM = mod.exports;
+  }
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _three, _CSMFrustum, _CSMShader) {
+  "use strict";
+
+  Object.defineProperty(_exports, "__esModule", {
+    value: true
+  });
+  _exports.CSM = void 0;
+
+  function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+  function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
+
+  function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+
+  var _cameraToLightMatrix = new _three.Matrix4();
+
+  var _lightSpaceFrustum = new _CSMFrustum.CSMFrustum();
+
+  var _center = new _three.Vector3();
+
+  var _bbox = new _three.Box3();
+
+  var _uniformArray = [];
+  var _logArray = [];
+
+  var CSM = /*#__PURE__*/function () {
+    function CSM(data) {
+      _classCallCheck(this, CSM);
+
+      data = data || {};
+      this.camera = data.camera;
+      this.parent = data.parent;
+      this.cascades = data.cascades || 3;
+      this.maxFar = data.maxFar || 100000;
+      this.mode = data.mode || 'practical';
+      this.shadowMapSize = data.shadowMapSize || 2048;
+      this.shadowBias = data.shadowBias || 0.000001;
+      this.lightDirection = data.lightDirection || new _three.Vector3(1, -1, 1).normalize();
+      this.lightIntensity = data.lightIntensity || 1;
+      this.lightNear = data.lightNear || 1;
+      this.lightFar = data.lightFar || 2000;
+      this.lightMargin = data.lightMargin || 200;
+      this.customSplitsCallback = data.customSplitsCallback;
+      this.fade = false;
+      this.mainFrustum = new _CSMFrustum.CSMFrustum();
+      this.frustums = [];
+      this.breaks = [];
+      this.lights = [];
+      this.shaders = new Map();
+      this.createLights();
+      this.updateFrustums();
+      this.injectInclude();
+    }
+
+    _createClass(CSM, [{
+      key: "createLights",
+      value: function createLights() {
+        for (var i = 0; i < this.cascades; i++) {
+          var light = new _three.DirectionalLight(0xffffff, this.lightIntensity);
+          light.castShadow = true;
+          light.shadow.mapSize.width = this.shadowMapSize;
+          light.shadow.mapSize.height = this.shadowMapSize;
+          light.shadow.camera.near = this.lightNear;
+          light.shadow.camera.far = this.lightFar;
+          light.shadow.bias = this.shadowBias;
+          this.parent.add(light);
+          this.parent.add(light.target);
+          this.lights.push(light);
+        }
+      }
+    }, {
+      key: "initCascades",
+      value: function initCascades() {
+        var camera = this.camera;
+        camera.updateProjectionMatrix();
+        this.mainFrustum.setFromProjectionMatrix(camera.projectionMatrix, this.maxFar);
+        this.mainFrustum.split(this.breaks, this.frustums);
+      }
+    }, {
+      key: "updateShadowBounds",
+      value: function updateShadowBounds() {
+        var frustums = this.frustums;
+
+        for (var i = 0; i < frustums.length; i++) {
+          var light = this.lights[i];
+          var shadowCam = light.shadow.camera;
+          var frustum = this.frustums[i]; // Get the two points that represent that furthest points on the frustum assuming
+          // that's either the diagonal across the far plane or the diagonal across the whole
+          // frustum itself.
+
+          var nearVerts = frustum.vertices.near;
+          var farVerts = frustum.vertices.far;
+          var point1 = farVerts[0];
+          var point2 = void 0;
+
+          if (point1.distanceTo(farVerts[2]) > point1.distanceTo(nearVerts[2])) {
+            point2 = farVerts[2];
+          } else {
+            point2 = nearVerts[2];
+          }
+
+          var squaredBBWidth = point1.distanceTo(point2);
+
+          if (this.fade) {
+            // expand the shadow extents by the fade margin if fade is enabled.
+            var camera = this.camera;
+            var far = Math.max(camera.far, this.maxFar);
+            var linearDepth = frustum.vertices.far[0].z / (far - camera.near);
+            var margin = 0.25 * Math.pow(linearDepth, 2.0) * (far - camera.near);
+            squaredBBWidth += margin;
+          }
+
+          shadowCam.left = -squaredBBWidth / 2;
+          shadowCam.right = squaredBBWidth / 2;
+          shadowCam.top = squaredBBWidth / 2;
+          shadowCam.bottom = -squaredBBWidth / 2;
+          shadowCam.updateProjectionMatrix();
+        }
+      }
+    }, {
+      key: "getBreaks",
+      value: function getBreaks() {
+        var camera = this.camera;
+        var far = Math.min(camera.far, this.maxFar);
+        this.breaks.length = 0;
+
+        switch (this.mode) {
+          case 'uniform':
+            uniformSplit(this.cascades, camera.near, far, this.breaks);
+            break;
+
+          case 'logarithmic':
+            logarithmicSplit(this.cascades, camera.near, far, this.breaks);
+            break;
+
+          case 'practical':
+            practicalSplit(this.cascades, camera.near, far, 0.5, this.breaks);
+            break;
+
+          case 'custom':
+            if (this.customSplitsCallback === undefined) console.error('CSM: Custom split scheme callback not defined.');
+            this.customSplitsCallback(this.cascades, camera.near, far, this.breaks);
+            break;
+        }
+
+        function uniformSplit(amount, near, far, target) {
+          for (var i = 1; i < amount; i++) {
+            target.push((near + (far - near) * i / amount) / far);
+          }
+
+          target.push(1);
+        }
+
+        function logarithmicSplit(amount, near, far, target) {
+          for (var i = 1; i < amount; i++) {
+            target.push(near * Math.pow(far / near, i / amount) / far);
+          }
+
+          target.push(1);
+        }
+
+        function practicalSplit(amount, near, far, lambda, target) {
+          _uniformArray.length = 0;
+          _logArray.length = 0;
+          logarithmicSplit(amount, near, far, _logArray);
+          uniformSplit(amount, near, far, _uniformArray);
+
+          for (var i = 1; i < amount; i++) {
+            target.push(_three.MathUtils.lerp(_uniformArray[i - 1], _logArray[i - 1], lambda));
+          }
+
+          target.push(1);
+        }
+      }
+    }, {
+      key: "update",
+      value: function update() {
+        var camera = this.camera;
+        var frustums = this.frustums;
+
+        for (var i = 0; i < frustums.length; i++) {
+          var light = this.lights[i];
+          var shadowCam = light.shadow.camera;
+          var texelWidth = (shadowCam.right - shadowCam.left) / this.shadowMapSize;
+          var texelHeight = (shadowCam.top - shadowCam.bottom) / this.shadowMapSize;
+          light.shadow.camera.updateMatrixWorld(true);
+
+          _cameraToLightMatrix.multiplyMatrices(light.shadow.camera.matrixWorldInverse, camera.matrixWorld);
+
+          frustums[i].toSpace(_cameraToLightMatrix, _lightSpaceFrustum);
+          var nearVerts = _lightSpaceFrustum.vertices.near;
+          var farVerts = _lightSpaceFrustum.vertices.far;
+
+          _bbox.makeEmpty();
+
+          for (var j = 0; j < 4; j++) {
+            _bbox.expandByPoint(nearVerts[j]);
+
+            _bbox.expandByPoint(farVerts[j]);
+          }
+
+          _bbox.getCenter(_center);
+
+          _center.z = _bbox.max.z + this.lightMargin;
+          _center.x = Math.floor(_center.x / texelWidth) * texelWidth;
+          _center.y = Math.floor(_center.y / texelHeight) * texelHeight;
+
+          _center.applyMatrix4(light.shadow.camera.matrixWorld);
+
+          light.position.copy(_center);
+          light.target.position.copy(_center);
+          light.target.position.x += this.lightDirection.x;
+          light.target.position.y += this.lightDirection.y;
+          light.target.position.z += this.lightDirection.z;
+        }
+      }
+    }, {
+      key: "injectInclude",
+      value: function injectInclude() {
+        _three.ShaderChunk.lights_fragment_begin = _CSMShader.CSMShader.lights_fragment_begin;
+        _three.ShaderChunk.lights_pars_begin = _CSMShader.CSMShader.lights_pars_begin;
+      }
+    }, {
+      key: "setupMaterial",
+      value: function setupMaterial(material) {
+        material.defines = material.defines || {};
+        material.defines.USE_CSM = 1;
+        material.defines.CSM_CASCADES = this.cascades;
+
+        if (this.fade) {
+          material.defines.CSM_FADE = '';
+        }
+
+        var breaksVec2 = [];
+        var scope = this;
+        var shaders = this.shaders;
+
+        material.onBeforeCompile = function (shader) {
+          var far = Math.min(scope.camera.far, scope.maxFar);
+          scope.getExtendedBreaks(breaksVec2);
+          shader.uniforms.CSM_cascades = {
+            value: breaksVec2
+          };
+          shader.uniforms.cameraNear = {
+            value: scope.camera.near
+          };
+          shader.uniforms.shadowFar = {
+            value: far
+          };
+          shaders.set(material, shader);
+        };
+
+        shaders.set(material, null);
+      }
+    }, {
+      key: "updateUniforms",
+      value: function updateUniforms() {
+        var far = Math.min(this.camera.far, this.maxFar);
+        var shaders = this.shaders;
+        shaders.forEach(function (shader, material) {
+          if (shader !== null) {
+            var uniforms = shader.uniforms;
+            this.getExtendedBreaks(uniforms.CSM_cascades.value);
+            uniforms.cameraNear.value = this.camera.near;
+            uniforms.shadowFar.value = far;
+          }
+
+          if (!this.fade && 'CSM_FADE' in material.defines) {
+            delete material.defines.CSM_FADE;
+            material.needsUpdate = true;
+          } else if (this.fade && !('CSM_FADE' in material.defines)) {
+            material.defines.CSM_FADE = '';
+            material.needsUpdate = true;
+          }
+        }, this);
+      }
+    }, {
+      key: "getExtendedBreaks",
+      value: function getExtendedBreaks(target) {
+        while (target.length < this.breaks.length) {
+          target.push(new _three.Vector2());
+        }
+
+        target.length = this.breaks.length;
+
+        for (var i = 0; i < this.cascades; i++) {
+          var amount = this.breaks[i];
+          var prev = this.breaks[i - 1] || 0;
+          target[i].x = prev;
+          target[i].y = amount;
+        }
+      }
+    }, {
+      key: "updateFrustums",
+      value: function updateFrustums() {
+        this.getBreaks();
+        this.initCascades();
+        this.updateShadowBounds();
+        this.updateUniforms();
+      }
+    }, {
+      key: "remove",
+      value: function remove() {
+        for (var i = 0; i < this.lights.length; i++) {
+          this.parent.remove(this.lights[i]);
+        }
+      }
+    }, {
+      key: "dispose",
+      value: function dispose() {
+        var shaders = this.shaders;
+        shaders.forEach(function (shader, material) {
+          delete material.onBeforeCompile;
+          delete material.defines.USE_CSM;
+          delete material.defines.CSM_CASCADES;
+          delete material.defines.CSM_FADE;
+
+          if (shader !== null) {
+            delete shader.uniforms.CSM_cascades;
+            delete shader.uniforms.cameraNear;
+            delete shader.uniforms.shadowFar;
+          }
+
+          material.needsUpdate = true;
+        });
+        shaders.clear();
+      }
+    }]);
+
+    return CSM;
+  }();
+
+  _exports.CSM = CSM;
+});

data/lib-opal/js_wrap/three/csm/CSMFrustum.js

@@ -0,0 +1,123 @@
+(function (global, factory) {
+  if (typeof define === "function" && define.amd) {
+    define(["exports", "three"], factory);
+  } else if (typeof exports !== "undefined") {
+    factory(exports, require("three"));
+  } else {
+    var mod = {
+      exports: {}
+    };
+    factory(mod.exports, global.three);
+    global.CSMFrustum = mod.exports;
+  }
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _three) {
+  "use strict";
+
+  Object.defineProperty(_exports, "__esModule", {
+    value: true
+  });
+  _exports.CSMFrustum = void 0;
+
+  function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+  function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
+
+  function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+
+  var inverseProjectionMatrix = new _three.Matrix4();
+
+  var CSMFrustum = /*#__PURE__*/function () {
+    function CSMFrustum(data) {
+      _classCallCheck(this, CSMFrustum);
+
+      data = data || {};
+      this.vertices = {
+        near: [new _three.Vector3(), new _three.Vector3(), new _three.Vector3(), new _three.Vector3()],
+        far: [new _three.Vector3(), new _three.Vector3(), new _three.Vector3(), new _three.Vector3()]
+      };
+
+      if (data.projectionMatrix !== undefined) {
+        this.setFromProjectionMatrix(data.projectionMatrix, data.maxFar || 10000);
+      }
+    }
+
+    _createClass(CSMFrustum, [{
+      key: "setFromProjectionMatrix",
+      value: function setFromProjectionMatrix(projectionMatrix, maxFar) {
+        var isOrthographic = projectionMatrix.elements[2 * 4 + 3] === 0;
+        inverseProjectionMatrix.copy(projectionMatrix).invert(); // 3 --- 0  vertices.near/far order
+        // |     |
+        // 2 --- 1
+        // clip space spans from [-1, 1]
+
+        this.vertices.near[0].set(1, 1, -1);
+        this.vertices.near[1].set(1, -1, -1);
+        this.vertices.near[2].set(-1, -1, -1);
+        this.vertices.near[3].set(-1, 1, -1);
+        this.vertices.near.forEach(function (v) {
+          v.applyMatrix4(inverseProjectionMatrix);
+        });
+        this.vertices.far[0].set(1, 1, 1);
+        this.vertices.far[1].set(1, -1, 1);
+        this.vertices.far[2].set(-1, -1, 1);
+        this.vertices.far[3].set(-1, 1, 1);
+        this.vertices.far.forEach(function (v) {
+          v.applyMatrix4(inverseProjectionMatrix);
+          var absZ = Math.abs(v.z);
+
+          if (isOrthographic) {
+            v.z *= Math.min(maxFar / absZ, 1.0);
+          } else {
+            v.multiplyScalar(Math.min(maxFar / absZ, 1.0));
+          }
+        });
+        return this.vertices;
+      }
+    }, {
+      key: "split",
+      value: function split(breaks, target) {
+        while (breaks.length > target.length) {
+          target.push(new CSMFrustum());
+        }
+
+        target.length = breaks.length;
+
+        for (var i = 0; i < breaks.length; i++) {
+          var cascade = target[i];
+
+          if (i === 0) {
+            for (var j = 0; j < 4; j++) {
+              cascade.vertices.near[j].copy(this.vertices.near[j]);
+            }
+          } else {
+            for (var _j = 0; _j < 4; _j++) {
+              cascade.vertices.near[_j].lerpVectors(this.vertices.near[_j], this.vertices.far[_j], breaks[i - 1]);
+            }
+          }
+
+          if (i === breaks.length - 1) {
+            for (var _j2 = 0; _j2 < 4; _j2++) {
+              cascade.vertices.far[_j2].copy(this.vertices.far[_j2]);
+            }
+          } else {
+            for (var _j3 = 0; _j3 < 4; _j3++) {
+              cascade.vertices.far[_j3].lerpVectors(this.vertices.near[_j3], this.vertices.far[_j3], breaks[i]);
+            }
+          }
+        }
+      }
+    }, {
+      key: "toSpace",
+      value: function toSpace(cameraMatrix, target) {
+        for (var i = 0; i < 4; i++) {
+          target.vertices.near[i].copy(this.vertices.near[i]).applyMatrix4(cameraMatrix);
+          target.vertices.far[i].copy(this.vertices.far[i]).applyMatrix4(cameraMatrix);
+        }
+      }
+    }]);
+
+    return CSMFrustum;
+  }();
+
+  _exports.CSMFrustum = CSMFrustum;
+});

data/lib-opal/js_wrap/three/csm/CSMHelper.js

@@ -0,0 +1,197 @@
+(function (global, factory) {
+  if (typeof define === "function" && define.amd) {
+    define(["exports", "three"], factory);
+  } else if (typeof exports !== "undefined") {
+    factory(exports, require("three"));
+  } else {
+    var mod = {
+      exports: {}
+    };
+    factory(mod.exports, global.three);
+    global.CSMHelper = mod.exports;
+  }
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _three) {
+  "use strict";
+
+  Object.defineProperty(_exports, "__esModule", {
+    value: true
+  });
+  _exports.CSMHelper = void 0;
+
+  function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+  function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
+
+  function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+
+  function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } Object.defineProperty(subClass, "prototype", { value: Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }), writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
+
+  function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+  function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+
+  function _possibleConstructorReturn(self, call) { if (call && (typeof call === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
+
+  function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+
+  function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+  function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+
+  var CSMHelper = /*#__PURE__*/function (_Group) {
+    _inherits(CSMHelper, _Group);
+
+    var _super = _createSuper(CSMHelper);
+
+    function CSMHelper(csm) {
+      var _this;
+
+      _classCallCheck(this, CSMHelper);
+
+      _this = _super.call(this);
+      _this.csm = csm;
+      _this.displayFrustum = true;
+      _this.displayPlanes = true;
+      _this.displayShadowBounds = true;
+      var indices = new Uint16Array([0, 1, 1, 2, 2, 3, 3, 0, 4, 5, 5, 6, 6, 7, 7, 4, 0, 4, 1, 5, 2, 6, 3, 7]);
+      var positions = new Float32Array(24);
+      var frustumGeometry = new _three.BufferGeometry();
+      frustumGeometry.setIndex(new _three.BufferAttribute(indices, 1));
+      frustumGeometry.setAttribute('position', new _three.BufferAttribute(positions, 3, false));
+      var frustumLines = new _three.LineSegments(frustumGeometry, new _three.LineBasicMaterial());
+
+      _this.add(frustumLines);
+
+      _this.frustumLines = frustumLines;
+      _this.cascadeLines = [];
+      _this.cascadePlanes = [];
+      _this.shadowLines = [];
+      return _this;
+    }
+
+    _createClass(CSMHelper, [{
+      key: "updateVisibility",
+      value: function updateVisibility() {
+        var displayFrustum = this.displayFrustum;
+        var displayPlanes = this.displayPlanes;
+        var displayShadowBounds = this.displayShadowBounds;
+        var frustumLines = this.frustumLines;
+        var cascadeLines = this.cascadeLines;
+        var cascadePlanes = this.cascadePlanes;
+        var shadowLines = this.shadowLines;
+
+        for (var i = 0, l = cascadeLines.length; i < l; i++) {
+          var cascadeLine = cascadeLines[i];
+          var cascadePlane = cascadePlanes[i];
+          var shadowLineGroup = shadowLines[i];
+          cascadeLine.visible = displayFrustum;
+          cascadePlane.visible = displayFrustum && displayPlanes;
+          shadowLineGroup.visible = displayShadowBounds;
+        }
+
+        frustumLines.visible = displayFrustum;
+      }
+    }, {
+      key: "update",
+      value: function update() {
+        var csm = this.csm;
+        var camera = csm.camera;
+        var cascades = csm.cascades;
+        var mainFrustum = csm.mainFrustum;
+        var frustums = csm.frustums;
+        var lights = csm.lights;
+        var frustumLines = this.frustumLines;
+        var frustumLinePositions = frustumLines.geometry.getAttribute('position');
+        var cascadeLines = this.cascadeLines;
+        var cascadePlanes = this.cascadePlanes;
+        var shadowLines = this.shadowLines;
+        this.position.copy(camera.position);
+        this.quaternion.copy(camera.quaternion);
+        this.scale.copy(camera.scale);
+        this.updateMatrixWorld(true);
+
+        while (cascadeLines.length > cascades) {
+          this.remove(cascadeLines.pop());
+          this.remove(cascadePlanes.pop());
+          this.remove(shadowLines.pop());
+        }
+
+        while (cascadeLines.length < cascades) {
+          var cascadeLine = new _three.Box3Helper(new _three.Box3(), 0xffffff);
+          var planeMat = new _three.MeshBasicMaterial({
+            transparent: true,
+            opacity: 0.1,
+            depthWrite: false,
+            side: _three.DoubleSide
+          });
+          var cascadePlane = new _three.Mesh(new _three.PlaneGeometry(), planeMat);
+          var shadowLineGroup = new _three.Group();
+          var shadowLine = new _three.Box3Helper(new _three.Box3(), 0xffff00);
+          shadowLineGroup.add(shadowLine);
+          this.add(cascadeLine);
+          this.add(cascadePlane);
+          this.add(shadowLineGroup);
+          cascadeLines.push(cascadeLine);
+          cascadePlanes.push(cascadePlane);
+          shadowLines.push(shadowLineGroup);
+        }
+
+        for (var i = 0; i < cascades; i++) {
+          var frustum = frustums[i];
+          var light = lights[i];
+          var shadowCam = light.shadow.camera;
+          var _farVerts = frustum.vertices.far;
+          var _cascadeLine = cascadeLines[i];
+          var _cascadePlane = cascadePlanes[i];
+          var _shadowLineGroup = shadowLines[i];
+          var _shadowLine = _shadowLineGroup.children[0];
+
+          _cascadeLine.box.min.copy(_farVerts[2]);
+
+          _cascadeLine.box.max.copy(_farVerts[0]);
+
+          _cascadeLine.box.max.z += 1e-4;
+
+          _cascadePlane.position.addVectors(_farVerts[0], _farVerts[2]);
+
+          _cascadePlane.position.multiplyScalar(0.5);
+
+          _cascadePlane.scale.subVectors(_farVerts[0], _farVerts[2]);
+
+          _cascadePlane.scale.z = 1e-4;
+          this.remove(_shadowLineGroup);
+
+          _shadowLineGroup.position.copy(shadowCam.position);
+
+          _shadowLineGroup.quaternion.copy(shadowCam.quaternion);
+
+          _shadowLineGroup.scale.copy(shadowCam.scale);
+
+          _shadowLineGroup.updateMatrixWorld(true);
+
+          this.attach(_shadowLineGroup);
+
+          _shadowLine.box.min.set(shadowCam.bottom, shadowCam.left, -shadowCam.far);
+
+          _shadowLine.box.max.set(shadowCam.top, shadowCam.right, -shadowCam.near);
+        }
+
+        var nearVerts = mainFrustum.vertices.near;
+        var farVerts = mainFrustum.vertices.far;
+        frustumLinePositions.setXYZ(0, farVerts[0].x, farVerts[0].y, farVerts[0].z);
+        frustumLinePositions.setXYZ(1, farVerts[3].x, farVerts[3].y, farVerts[3].z);
+        frustumLinePositions.setXYZ(2, farVerts[2].x, farVerts[2].y, farVerts[2].z);
+        frustumLinePositions.setXYZ(3, farVerts[1].x, farVerts[1].y, farVerts[1].z);
+        frustumLinePositions.setXYZ(4, nearVerts[0].x, nearVerts[0].y, nearVerts[0].z);
+        frustumLinePositions.setXYZ(5, nearVerts[3].x, nearVerts[3].y, nearVerts[3].z);
+        frustumLinePositions.setXYZ(6, nearVerts[2].x, nearVerts[2].y, nearVerts[2].z);
+        frustumLinePositions.setXYZ(7, nearVerts[1].x, nearVerts[1].y, nearVerts[1].z);
+        frustumLinePositions.needsUpdate = true;
+      }
+    }]);
+
+    return CSMHelper;
+  }(_three.Group);
+
+  _exports.CSMHelper = CSMHelper;
+});