UNPKG

glsl-pipeline

Version:

Prototype complex pipelines directly from a single shader by branching it into stages using React Three Fiber/React.

828 lines (813 loc) 32.8 kB
'use strict'; var three = require('three'); var RGBELoader_js = require('three/examples/jsm/loaders/RGBELoader.js'); var LightProbeGenerator_js = require('three/examples/jsm/lights/LightProbeGenerator.js'); function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; } function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; } function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; } function _objectSpread2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } function _regeneratorDefine(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine = function (e, r, n, t) { function o(r, n) { _regeneratorDefine(e, r, function (e) { return this._invoke(r, n, e); }); } r ? i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2)); }, _regeneratorDefine(e, r, n, t); } function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = !1, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function (t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = !0, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i.return) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), !0), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine(u), _regeneratorDefine(u, o, "Generator"), _regeneratorDefine(u, n, function () { return this; }), _regeneratorDefine(u, "toString", function () { return "[object Generator]"; }), (_regenerator = function () { return { w: i, m: f }; })(); } function asyncGeneratorStep(n, t, e, r, o, a, c) { try { var i = n[a](c), u = i.value; } catch (n) { return void e(n); } i.done ? t(u) : Promise.resolve(u).then(r, o); } function _asyncToGenerator(n) { return function () { var t = this, e = arguments; return new Promise(function (r, o) { var a = n.apply(t, e); function _next(n) { asyncGeneratorStep(a, r, o, _next, _throw, "next", n); } function _throw(n) { asyncGeneratorStep(a, r, o, _next, _throw, "throw", n); } _next(void 0); }); }; } function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); } function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } } function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; } var GlslPipeline = /*#__PURE__*/function () { function GlslPipeline(renderer) { var _this = this; var uniforms = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {}; _classCallCheck(this, GlslPipeline); if (renderer.extensions.has("OES_texture_float")) { this.floatType = three.FloatType; } else if (renderer.extensions.has("OES_texture_half_float")) { this.floatType = three.HalfFloatType; } else { this.floatType = three.UnsignedByteType; } this.id = three.MathUtils.generateUUID(); this.renderer = renderer; this.defines = { 'PLATFORM_WEBGL': '2' }; this.options = options; this.uniforms = uniforms; this.frag_src = null; this.vert_src = null; this.dirty = false; this.uniforms.u_camera = { value: /* @__PURE__ */new three.Vector3() }; this.uniforms.u_cameraNearClip = { value: 0.0 }; this.uniforms.u_cameraFarClip = { value: 0.0 }; this.uniforms.u_cameraDistance = { value: 0.0 }; this.uniforms.u_viewMatrix = { value: null }; this.uniforms.u_inverseViewMatrix = { value: null }; this.uniforms.u_projectionMatrix = { value: null }; this.uniforms.u_inverseProjectionMatrix = { value: null }; this.uniforms.u_normalMatrix = { value: null }; this.uniforms.u_modelMatrix = { value: null }; this.uniforms.u_resolution = { value: /* @__PURE__ */new three.Vector2() }; this.uniforms.u_mouse = { value: /* @__PURE__ */new three.Vector2() }; this.uniforms.u_delta = { value: 0.0 }; this.uniforms.u_time = { value: 0.0 }; this.uniforms.u_frame = { value: 0 }; this.uniforms.u_date = { value: /* @__PURE__ */new three.Vector4() }; this.light = null; this.buffers = []; this.doubleBuffers = []; this.background = null; this.material = null; this.sceneBuffer = null; this.postprocessing = null; this.billboard_scene = /* @__PURE__ */new three.Scene(); this.billboard_camera = /* @__PURE__ */new three.Camera(); this.billboard_camera.position.z = 1; this.passThruUniforms = { texture: { value: null } }; this.passThruShader = createShaderMaterial(this.passThruUniforms, {}, options, getPassThroughFragmentShader()); this.mesh = /* @__PURE__ */new three.Mesh(new three.PlaneGeometry(2, 2), this.passThruShader); this.billboard_scene.add(this.mesh); this.clock = /* @__PURE__ */new three.Clock(); this.frame = 0; this.lastTime = 0.0; this.time = 0.0; this.resolution = /* @__PURE__ */new three.Vector2(renderer.domElement.width, renderer.domElement.height); document.addEventListener('mousemove', function (e) { var rect = renderer.domElement.getBoundingClientRect(); var x = e.clientX || e.pageX; var y = e.clientY || e.pageY; _this.uniforms.u_mouse.value.x = (x - rect.left) * window.devicePixelRatio; _this.uniforms.u_mouse.value.y = renderer.domElement.height - (y - rect.top) * window.devicePixelRatio; }, false); } return _createClass(GlslPipeline, [{ key: "getBufferSize", value: function getBufferSize(name) { if (this.frag_src == null) return { width: 1.0, height: 1.0 }; var size_exp = new RegExp("uniform\\s*sampler2D\\s*".concat(name, "\\;\\s*\\/\\/*\\s(\\d+)x(\\d+)"), 'gm'); var size_found = size_exp.exec(this.frag_src); if (size_found) return { width: parseInt(size_found[1]), height: parseInt(size_found[2]) }; var scale_exp = new RegExp("uniform\\s*sampler2D\\s*".concat(name, "\\;\\s*\\/\\/*\\s(\\d*\\.\\d+|\\d+)"), 'gm'); var scale_found = scale_exp.exec(this.frag_src); if (scale_found) { if (scale_found.length > 2) return { width: parseFloat(scale_found[1]), height: parseFloat(scale_found[2]) };else if (scale_found.length > 1) return { width: parseFloat(scale_found[1]), height: parseFloat(scale_found[1]) }; } return { width: 1.0, height: 1.0 }; } }, { key: "load", value: function load(frag_src) { var _this$frag_src, _this$frag_src2; var vert_src = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null; this.frag_src = frag_src; this.vert_src = vert_src; var found_background = (_this$frag_src = this.frag_src) === null || _this$frag_src === void 0 ? void 0 : _this$frag_src.match(/(?:^\s*)((?:#if|#elif)(?:\s*)(defined\s*\(\s*BACKGROUND)(?:\s*\))|(?:#ifdef)(?:\s*BACKGROUND)(?:\s*))/gm); if (found_background) { this.renderer.autoClearColor = false; this.addBackground(); } var found_buffers = (_this$frag_src2 = this.frag_src) === null || _this$frag_src2 === void 0 ? void 0 : _this$frag_src2.match(/(?:^\s*)((?:#if|#elif)(?:\s*)(defined\s*\(\s*BUFFER_)(\d+)(?:\s*\))|(?:#ifdef)(?:\s*BUFFER_)(\d+)(?:\s*))/gm); this.buffers = []; if (found_buffers) for (var i = 0; i < found_buffers.length; i++) { var s = this.getBufferSize("u_buffer".concat(i)); this.addBuffer(s.width, s.height); } var found_doubleBuffers = frag_src.match(/(?:^\s*)((?:#if|#elif)(?:\s*)(defined\s*\(\s*DOUBLE_BUFFER_)(\d+)(?:\s*\))|(?:#ifdef)(?:\s*DOUBLE_BUFFER_)(\d+)(?:\s*))/gm); this.doubleBuffers = []; if (found_doubleBuffers) { this.renderer.autoClearColor = false; for (var _i = 0; _i < found_doubleBuffers.length; _i++) { var _s = this.getBufferSize("u_doubleBuffer".concat(_i)); this.addDoubleBuffer(_s.width, _s.height); } } this.material = createShaderMaterial(this.uniforms, this.defines, this.options, this.frag_src, this.vert_src); var found_postprocessing = this.frag_src.match(/(?:^\s*)((?:#if|#elif)(?:\s*)(defined\s*\(\s*POSTPROCESSING)(?:\s*\))|(?:#ifdef)(?:\s*POSTPROCESSING)(?:\s*))/gm); if (found_postprocessing) this.addPostprocessing(); } }, { key: "reload", value: function reload() { this.load(this.frag_src, this.vert_src); this.dirty = false; } }, { key: "reset", value: function reset() { var _this2 = this; // Reset time, frame count, and clear double buffers. this.clock = new three.Clock(); this.frame = 0; this.lastTime = 0.0; this.time = 0.0; this.doubleBuffers.forEach(function (buffer) { buffer.renderTargets.forEach(function (renderTarget) { _this2.renderer.setRenderTarget(renderTarget); _this2.renderer.clear(); }); }); } }, { key: "branchMaterial", value: function branchMaterial(name) { if (Array.isArray(name)) { var names = name.map(function (str) { return "#define ".concat(str.toUpperCase(), "\n"); }).filter(Boolean).join(''); return createShaderMaterial(this.uniforms, this.defines, this.options, "".concat(names).concat(this.frag_src), "".concat(names).concat(this.vert_src)); } else { return createShaderMaterial(this.uniforms, this.defines, this.options, "#define ".concat(name.toUpperCase(), "\n").concat(this.frag_src), "#define ".concat(name.toUpperCase(), "\n").concat(this.vert_src)); } } }, { key: "addBackground", value: function addBackground() { this.background = createShaderMaterial(this.uniforms, this.defines, this.options, "#define BACKGROUND\n".concat(this.frag_src)); return this.background; } }, { key: "addBuffer", value: function addBuffer(width, height) { var index = this.buffers.length; var material = createShaderMaterial(this.uniforms, this.defines, this.options, "#define BUFFER_".concat(index, "\n").concat(this.frag_src)); var b = { name: "u_buffer".concat(index), material: material, renderTarget: null, width: width, height: height, wrapS: three.RepeatWrapping, wrapT: three.RepeatWrapping, minFilter: three.LinearFilter, magFilter: three.LinearFilter }; this.buffers.push(b); this.uniforms[b.name] = { value: null }; b.renderTarget = this.createRenderTarget(b); return b; } }, { key: "addDoubleBuffer", value: function addDoubleBuffer(width, height) { var index = this.doubleBuffers.length; var material = createShaderMaterial(this.uniforms, this.defines, this.options, "#define DOUBLE_BUFFER_".concat(index, "\n").concat(this.frag_src)); var db = { name: "u_doubleBuffer".concat(index), material: material, renderTargets: [], width: width, height: height, wrapS: three.RepeatWrapping, wrapT: three.RepeatWrapping, minFilter: three.LinearFilter, magFilter: three.LinearFilter }; this.doubleBuffers.push(db); this.uniforms[db.name] = { value: null }; db.renderTargets[0] = this.createRenderTarget(db); db.renderTargets[1] = this.createRenderTarget(db); return db; } }, { key: "addPostprocessing", value: function addPostprocessing() { this.postprocessing = createShaderMaterial(this.uniforms, this.defines, this.options, "#define POSTPROCESSING\n".concat(this.frag_src)); this.sceneBuffer = { renderTarget: null, width: this.renderer.domElement.width, height: this.renderer.domElement.height }; this.uniforms.u_scene = { value: null }; this.uniforms.u_sceneDepth = { value: null }; this.sceneBuffer.renderTarget = this.createRenderTarget({ width: this.sceneBuffer.width, height: this.sceneBuffer.height, wrapS: undefined, wrapT: undefined, minFilter: three.LinearFilter, magFilter: three.LinearFilter, depth: true }); return this.sceneBuffer; } }, { key: "setLight", value: function setLight(light) { var _this$light$shadow, _this3 = this; this.light = light; this.uniforms.u_lightMatrix = { value: (_this$light$shadow = this.light.shadow) === null || _this$light$shadow === void 0 ? void 0 : _this$light$shadow.matrix }; this.uniforms.u_light = { value: this.light.position }; this.uniforms.u_lightColor = { value: this.light.color }; this.uniforms.u_lightIntensity = { value: this.light.intensity }; this.uniforms.u_lightShadowMap = { value: null }; var present = ["LIGHT_SHADOWMAP", "LIGHT_SHADOWMAP_SIZE"].filter(function (item) { return _this3.defines[item]; }); if (present.length <= 1) { var _this$light$shadow2; this.defines["LIGHT_SHADOWMAP"] = "u_lightShadowMap"; this.defines["LIGHT_SHADOWMAP_SIZE"] = (_this$light$shadow2 = this.light.shadow) === null || _this$light$shadow2 === void 0 ? void 0 : _this$light$shadow2.mapSize.width.toString(); this.dirty = true; } } }, { key: "setCubemap", value: function setCubemap(hdrUrl, scene) { var _this4 = this; var cubeRenderTarget = new three.WebGLCubeRenderTarget(256); var cubeCamera = new three.CubeCamera(1, 1000, cubeRenderTarget); cubeCamera.position.set(0, 1, 0); var lightProbe; var uniforms = this.uniforms; var renderer = this.renderer; if (!this.uniforms.u_cubeMap) this.uniforms.u_cubeMap = { value: null }; if (!this.uniforms.u_SH) this.uniforms.u_SH = { value: [new three.Vector3(0.0, 0.0, 0.0), new three.Vector3(0.0, 0.0, 0.0), new three.Vector3(0.0, 0.0, 0.0), new three.Vector3(0.0, 0.0, 0.0), new three.Vector3(0.0, 0.0, 0.0), new three.Vector3(0.0, 0.0, 0.0), new three.Vector3(0.0, 0.0, 0.0), new three.Vector3(0.0, 0.0, 0.0), new three.Vector3(0.0, 0.0, 0.0)] }; var present = ["SCENE_SH_ARRAY", "SCENE_CUBEMAP"].filter(function (item) { return _this4.defines[item]; }); if (present.length <= 1) { this.defines["SCENE_SH_ARRAY"] = "u_SH"; this.defines["SCENE_CUBEMAP"] = "u_cubeMap"; this.dirty = true; } new RGBELoader_js.RGBELoader().load(hdrUrl, /*#__PURE__*/function () { var _ref = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(cubemap) { var cubeScene, probe; return _regenerator().w(function (_context) { while (1) switch (_context.n) { case 0: cubemap.mapping = three.EquirectangularReflectionMapping; cubemap.flipY = true; if (scene) { scene.background = cubemap; scene.environment = cubemap; uniforms.u_cubeMap.value = cubemap; cubeCamera.update(renderer, scene); } else { cubeScene = new three.Scene(); cubeScene.background = cubemap; cubeScene.environment = cubemap; cubeCamera.update(renderer, cubeScene); } _context.n = 1; return LightProbeGenerator_js.LightProbeGenerator.fromCubeRenderTarget(renderer, cubeRenderTarget); case 1: probe = _context.v; lightProbe = probe; uniforms.u_SH.value = lightProbe.sh.coefficients; uniforms.u_cubeMap.value = cubeRenderTarget.texture; case 2: return _context.a(2); } }, _callee); })); return function (_x) { return _ref.apply(this, arguments); }; }()); } }, { key: "setDefine", value: function setDefine(name) { var value = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined; if (this.defines[name] === undefined) { this.defines[name] = value === undefined ? '' : value.toString(); this.dirty = true; } } }, { key: "createRenderTarget", value: function createRenderTarget(b) { b.wrapS = b.wrapS || three.ClampToEdgeWrapping; b.wrapT = b.wrapT || three.ClampToEdgeWrapping; b.minFilter = b.minFilter || three.NearestFilter; b.magFilter = b.magFilter || three.NearestFilter; var w = b.width; var h = b.height; if (w <= 1.0 && h <= 1.0) { w *= this.renderer.domElement.width; h *= this.renderer.domElement.height; } var depth = null; if (b.depth) depth = /* @__PURE__ */new three.DepthTexture(w, h); var renderTarget = /* @__PURE__ */new three.WebGLRenderTarget(Math.floor(w), Math.floor(h), { wrapS: b.wrapS, wrapT: b.wrapT, minFilter: b.minFilter, magFilter: b.magFilter, format: three.RGBAFormat, type: this.floatType, stencilBuffer: false, depthTexture: depth }); return renderTarget; } }, { key: "updateUniforms", value: function updateUniforms() { var camera = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null; this.time = this.clock.getElapsedTime(); this.uniforms.u_frame.value = this.frame; this.uniforms.u_time.value = this.time; this.uniforms.u_delta.value = this.time - this.lastTime; this.uniforms.u_resolution.value = this.resolution; var date = new Date(); this.uniforms.u_date.value = /* @__PURE__ */new three.Vector4(date.getFullYear(), date.getMonth(), date.getDate(), date.getHours() * 3600 + date.getMinutes() * 60 + date.getSeconds() + date.getMilliseconds() * 0.001); if (camera) { this.uniforms.u_camera.value = camera.position; this.uniforms.u_cameraDistance.value = camera.position.length(); this.uniforms.u_cameraNearClip.value = camera.near; this.uniforms.u_cameraFarClip.value = camera.far; this.uniforms.u_projectionMatrix.value = camera.projectionMatrix; this.uniforms.u_inverseProjectionMatrix.value = camera.projectionMatrixInverse; this.uniforms.u_viewMatrix.value = camera.matrixWorldInverse; this.uniforms.u_inverseViewMatrix.value = camera.matrixWorld; this.uniforms.u_normalMatrix.value = camera.normalMatrix; this.uniforms.u_modelMatrix.value = camera.matrixWorld; } if (this.light) { var _this$light$shadow3, _this$light$shadow4, _this$light$shadow5; this.uniforms.u_lightMatrix = { value: (_this$light$shadow3 = this.light.shadow) === null || _this$light$shadow3 === void 0 ? void 0 : _this$light$shadow3.matrix }; this.uniforms.u_light = { value: this.light.position }; this.uniforms.u_lightColor = { value: this.light.color }; this.uniforms.u_lightIntensity = { value: this.light.intensity }; if ((_this$light$shadow4 = this.light.shadow) !== null && _this$light$shadow4 !== void 0 && _this$light$shadow4.map) this.uniforms.u_lightShadowMap = { value: (_this$light$shadow5 = this.light.shadow) === null || _this$light$shadow5 === void 0 ? void 0 : _this$light$shadow5.map.texture }; } this.lastTime = this.time; this.frame++; } }, { key: "updateBuffers", value: function updateBuffers() { // Buffers for (var i = 0, il = this.buffers.length; i < il; i++) { var _b$renderTarget; var b = this.buffers[i]; if (b.width <= 1.0 && b.height <= 1.0) this.uniforms.u_resolution.value = /* @__PURE__ */new three.Vector2(Math.floor(this.resolution.x * b.width), Math.floor(this.resolution.y * b.height));else this.uniforms.u_resolution.value = /* @__PURE__ */new three.Vector2(b.width, b.height); this.renderTarget(b.material, b.renderTarget); this.uniforms[b.name].value = (_b$renderTarget = b.renderTarget) === null || _b$renderTarget === void 0 ? void 0 : _b$renderTarget.texture; } // Double buffers var currentTextureIndex = this.frame % 2; var nextTextureIndex = (this.frame + 1) % 2; for (var _i2 = 0, _il = this.doubleBuffers.length; _i2 < _il; _i2++) { var db = this.doubleBuffers[_i2]; if (db.width <= 1.0 && db.height <= 1.0) this.uniforms.u_resolution.value = new three.Vector2(Math.floor(this.resolution.x * db.width), Math.floor(this.resolution.y * db.height));else this.uniforms.u_resolution.value = new three.Vector2(db.width, db.height); this.uniforms[db.name].value = db.renderTargets[currentTextureIndex].texture; this.renderTarget(db.material, db.renderTargets[nextTextureIndex]); // this.uniforms[db.name].value = db.renderTargets[nextTextureIndex].texture; } this.renderer.setRenderTarget(null); } }, { key: "renderBackground", value: function renderBackground() { if (this.background) { this.mesh.material = this.background; this.renderer.render(this.billboard_scene, this.billboard_camera); this.mesh.material = this.passThruShader; } } }, { key: "getBufferTexture", value: function getBufferTexture(index) { var _this$buffers$index$r; if (index >= this.buffers.length) return; return (_this$buffers$index$r = this.buffers[index].renderTarget) === null || _this$buffers$index$r === void 0 ? void 0 : _this$buffers$index$r.texture; } }, { key: "getDoubleBufferTexture", value: function getDoubleBufferTexture(index) { if (index >= this.doubleBuffers.length) return; return this.doubleBuffers[index].renderTargets[this.frame % 2].texture; } }, { key: "renderBuffer", value: function renderBuffer(index) { if (index >= this.buffers.length) return; this.uniforms.u_resolution.value = this.resolution; this.passThruUniforms.texture.value = this.getBufferTexture(index); this.mesh.material = this.passThruShader; this.renderer.render(this.billboard_scene, this.billboard_camera); } }, { key: "renderDoubleBuffer", value: function renderDoubleBuffer(index) { if (index >= this.doubleBuffers.length) return; this.uniforms.u_resolution.value = this.resolution; this.passThruUniforms.texture.value = this.getDoubleBufferTexture(index); this.mesh.material = this.passThruShader; this.renderer.render(this.billboard_scene, this.billboard_camera); } }, { key: "renderMain", value: function renderMain() { if (this.dirty) this.reload(); this.updateUniforms(); this.updateBuffers(); this.uniforms.u_resolution.value = this.resolution; this.mesh.material = this.material; this.renderer.render(this.billboard_scene, this.billboard_camera); this.mesh.material = this.passThruShader; } }, { key: "renderScene", value: function renderScene(scene, camera) { if (this.dirty) this.reload(); this.updateUniforms(camera); this.updateBuffers(); if (this.sceneBuffer) { this.renderer.setRenderTarget(this.sceneBuffer.renderTarget); this.renderer.clear(); } this.renderBackground(); this.renderer.render(scene, camera); if (this.sceneBuffer) { var _this$sceneBuffer$ren, _this$sceneBuffer$ren2; this.renderer.setRenderTarget(null); this.renderer.clear(); this.uniforms.u_resolution.value = this.resolution; this.uniforms.u_scene.value = (_this$sceneBuffer$ren = this.sceneBuffer.renderTarget) === null || _this$sceneBuffer$ren === void 0 ? void 0 : _this$sceneBuffer$ren.texture; this.uniforms.u_sceneDepth.value = (_this$sceneBuffer$ren2 = this.sceneBuffer.renderTarget) === null || _this$sceneBuffer$ren2 === void 0 ? void 0 : _this$sceneBuffer$ren2.depthTexture; this.mesh.material = this.postprocessing; this.renderer.render(this.billboard_scene, this.billboard_camera); this.mesh.material = this.passThruShader; } } }, { key: "renderTarget", value: function renderTarget(material, output) { this.mesh.material = material; this.renderer.setRenderTarget(output); // this.renderer.clear(); this.renderer.render(this.billboard_scene, this.billboard_camera); this.mesh.material = this.passThruShader; } }, { key: "setSize", value: function setSize(width, height) { width *= window.devicePixelRatio; height *= window.devicePixelRatio; if (this.sceneBuffer) { var _this$sceneBuffer$ren3; this.sceneBuffer.width = width; this.sceneBuffer.height = height; (_this$sceneBuffer$ren3 = this.sceneBuffer.renderTarget) === null || _this$sceneBuffer$ren3 === void 0 || _this$sceneBuffer$ren3.setSize(width, height); } this.resolution = /* @__PURE__ */new three.Vector2(width, height); this.uniforms.u_resolution.value = this.resolution; for (var i = 0; i < this.buffers.length; i++) { var _b$renderTarget2; var b = this.buffers[i]; if (b.width <= 1.0 && b.height <= 1.0) (_b$renderTarget2 = b.renderTarget) === null || _b$renderTarget2 === void 0 || _b$renderTarget2.setSize(b.width * width, b.height * height); } for (var _i3 = 0; _i3 < this.doubleBuffers.length; _i3++) { this.renderer.autoClearColor = false; var db = this.doubleBuffers[_i3]; if (db.width <= 1.0 && db.height <= 1.0) { var w = Math.floor(db.width * width); var h = Math.floor(db.height * height); db.renderTargets[0].setSize(w, h); db.renderTargets[1].setSize(w, h); } } this.frame = 0; } }, { key: "dispose", value: function dispose() { var _this$sceneBuffer, _this$sceneBuffer2, _this$material; this.buffers.forEach(function (buffer) { buffer.renderTarget.texture.dispose(); buffer.renderTarget.dispose(); }); this.doubleBuffers.forEach(function (buffer) { buffer.renderTargets.forEach(function (renderTarget) { renderTarget.texture.dispose(); renderTarget.dispose(); }); }); (_this$sceneBuffer = this.sceneBuffer) === null || _this$sceneBuffer === void 0 || (_this$sceneBuffer = _this$sceneBuffer.renderTarget) === null || _this$sceneBuffer === void 0 || _this$sceneBuffer.texture.dispose(); (_this$sceneBuffer2 = this.sceneBuffer) === null || _this$sceneBuffer2 === void 0 || (_this$sceneBuffer2 = _this$sceneBuffer2.renderTarget) === null || _this$sceneBuffer2 === void 0 || _this$sceneBuffer2.dispose(); (_this$material = this.material) === null || _this$material === void 0 || _this$material.dispose(); } }]); }(); function createShaderMaterial(uniforms, defines, options, fragmentShader, vertexShader) { var material = /* @__PURE__ */new three.ShaderMaterial(_objectSpread2({ uniforms: uniforms === undefined ? {} : uniforms, vertexShader: vertexShader || getPassThroughVertexShader(), fragmentShader: fragmentShader }, options)); material.defines = Object.assign({}, defines, options.defines); return material; } function getPassThroughVertexShader() { return /* glsl */"varying vec2 v_texcoord;\n void main() {\n v_texcoord = uv;\n gl_Position = vec4(position, 1.0);\n }"; } function getPassThroughFragmentShader() { return /* glsl */"uniform sampler2D texture;\n uniform vec2 u_resolution;\n void main() {\n vec2 uv = gl_FragCoord.xy / u_resolution.xy;\n gl_FragColor = texture2D( texture, uv );\n }"; } exports.GlslPipeline = GlslPipeline;