eric/matrix
1
0
Fork 0
mirror of https://github.com/Rezmason/matrix.git synced 2026-04-20 23:09:30 -07:00
Code Issues Packages Projects Releases Wiki Activity

Added textures to base and glint shapes.

Browse Source
This commit is contained in:
Rezmason
2022-09-17 13:51:48 -07:00
parent eddbd12c36
commit e2be02c498
12 changed files with 167 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
js/regl/rainPass.js
View File

@@ -34,7 +34,7 @@ export default ({ regl, config, lkg }) => {
// to reach the desired density, and then overlaps them
const volumetric = config.volumetric;
const density = volumetric && config.effect !== "none" ? config.density : 1;
const [numRows, numColumns] = [config.numColumns, config.numColumns * density];
const [numRows, numColumns] = [config.numColumns, Math.floor(config.numColumns * density)];
// The volumetric mode requires us to create a grid of quads,
// rather than a single quad for our geometry
@@ -115,8 +115,10 @@ export default ({ regl, config, lkg }) => {
);
// We render the code into an FBO using MSDFs: https://github.com/Chlumsky/msdfgen
const msdf = loadImage(regl, config.glyphTexURL);
const glintMSDF = loadImage(regl, config.glintTexURL);
const glyphMSDF = loadImage(regl, config.glyphMSDFURL);
const glintMSDF = loadImage(regl, config.glintMSDFURL);
const baseTexture = loadImage(regl, config.baseTextureURL);
const glintTexture = loadImage(regl, config.glintTextureURL);
const rainPassVert = loadText("shaders/glsl/rainPass.vert.glsl");
const rainPassFrag = loadText("shaders/glsl/rainPass.frag.glsl");
const output = makePassFBO(regl, config.useHalfFloat);
@@ -131,6 +133,8 @@ export default ({ regl, config, lkg }) => {
"baseContrast",
"glintBrightness",
"glintContrast",
"hasBaseTexture",
"hasGlintTexture",
"brightnessThreshold",
"brightnessOverride",
"isolateCursor",
@@ -163,8 +167,10 @@ export default ({ regl, config, lkg }) => {
raindropState: raindropDoubleBuffer.front,
symbolState: symbolDoubleBuffer.front,
effectState: effectDoubleBuffer.front,
glyphTex: msdf.texture,
glintTex: glintMSDF.texture,
glyphMSDF: glyphMSDF.texture,
glintMSDF: glintMSDF.texture,
baseTexture: baseTexture.texture,
glintTexture: glintTexture.texture,
camera: regl.prop("camera"),
transform: regl.prop("transform"),
@@ -206,7 +212,16 @@ export default ({ regl, config, lkg }) => {
{
primary: output,
},
Promise.all([msdf.loaded, glintMSDF.loaded, rainPassShine.loaded, rainPassSymbol.loaded, rainPassVert.loaded, rainPassFrag.loaded]),
Promise.all([
glyphMSDF.loaded,
glintMSDF.loaded,
baseTexture.loaded,
glintTexture.loaded,
rainPassShine.loaded,
rainPassSymbol.loaded,
rainPassVert.loaded,
rainPassFrag.loaded,
]),
(w, h) => {
output.resize(w, h);
const aspectRatio = w / h;

6
js/regl/utils.js
View File

@@ -1,11 +1,11 @@
const makePassTexture = (regl, halfFloat) =>
const makePassTexture = (regl, halfFloat, mipmap) =>
regl.texture({
width: 1,
height: 1,
type: halfFloat ? "half float" : "uint8",
wrap: "clamp",
min: "linear",
mag: "linear",
min: mipmap ? "mipmap" : "linear",
mag: mipmap ? "mipmap" : "linear",
});
const makePassFBO = (regl, halfFloat) => regl.framebuffer({ color: makePassTexture(regl, halfFloat) });