UNPKG

glsl-pipeline

Version:

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

826 lines (812 loc) 32.7 kB
import { Clock, LinearFilter, WebGLCubeRenderTarget, CubeCamera, Vector3, ClampToEdgeWrapping, NearestFilter, WebGLRenderTarget, RGBAFormat, Vector4, Vector2, ShaderMaterial, FloatType, HalfFloatType, UnsignedByteType, MathUtils, Scene, Camera, Mesh, PlaneGeometry, RepeatWrapping, DepthTexture, EquirectangularReflectionMapping } from 'three'; import { RGBELoader } from 'three/examples/jsm/loaders/RGBELoader.js'; import { LightProbeGenerator } from '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 = FloatType; } else if (renderer.extensions.has("OES_texture_half_float")) { this.floatType = HalfFloatType; } else { this.floatType = UnsignedByteType; } this.id = 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 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 Vector2() }; this.uniforms.u_mouse = { value: /* @__PURE__ */new 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 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 Scene(); this.billboard_camera = /* @__PURE__ */new Camera(); this.billboard_camera.position.z = 1; this.passThruUniforms = { texture: { value: null } }; this.passThruShader = createShaderMaterial(this.passThruUniforms, {}, options, getPassThroughFragmentShader()); this.mesh = /* @__PURE__ */new Mesh(new PlaneGeometry(2, 2), this.passThruShader); this.billboard_scene.add(this.mesh); this.clock = /* @__PURE__ */new Clock(); this.frame = 0; this.lastTime = 0.0; this.time = 0.0; this.resolution = /* @__PURE__ */new 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 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: RepeatWrapping, wrapT: RepeatWrapping, minFilter: LinearFilter, magFilter: 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: RepeatWrapping, wrapT: RepeatWrapping, minFilter: LinearFilter, magFilter: 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: LinearFilter, magFilter: 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 WebGLCubeRenderTarget(256); var cubeCamera = new 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 Vector3(0.0, 0.0, 0.0), new Vector3(0.0, 0.0, 0.0), new Vector3(0.0, 0.0, 0.0), new Vector3(0.0, 0.0, 0.0), new Vector3(0.0, 0.0, 0.0), new Vector3(0.0, 0.0, 0.0), new Vector3(0.0, 0.0, 0.0), new Vector3(0.0, 0.0, 0.0), new 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().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 = EquirectangularReflectionMapping; cubemap.flipY = true; if (scene) { scene.background = cubemap; scene.environment = cubemap; uniforms.u_cubeMap.value = cubemap; cubeCamera.update(renderer, scene); } else { cubeScene = new Scene(); cubeScene.background = cubemap; cubeScene.environment = cubemap; cubeCamera.update(renderer, cubeScene); } _context.n = 1; return 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 || ClampToEdgeWrapping; b.wrapT = b.wrapT || ClampToEdgeWrapping; b.minFilter = b.minFilter || NearestFilter; b.magFilter = b.magFilter || 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 DepthTexture(w, h); var renderTarget = /* @__PURE__ */new WebGLRenderTarget(Math.floor(w), Math.floor(h), { wrapS: b.wrapS, wrapT: b.wrapT, minFilter: b.minFilter, magFilter: b.magFilter, format: 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 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 Vector2(Math.floor(this.resolution.x * b.width), Math.floor(this.resolution.y * b.height));else this.uniforms.u_resolution.value = /* @__PURE__ */new 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 Vector2(Math.floor(this.resolution.x * db.width), Math.floor(this.resolution.y * db.height));else this.uniforms.u_resolution.value = new 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 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 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 }"; } export { GlslPipeline as G };