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

Removing the "resurrection" effect that mirrored the Matrix Resurrections trailers, as they aren't canon and the color channels of the output textures can be put to better use

Browse Source
This commit is contained in:
Rezmason
2022-09-04 23:56:49 -07:00
parent 1aeaba7a3f
commit 33edffc99c
9 changed files with 4 additions and 148 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
js/config.js
View File

@@ -56,7 +56,6 @@ const defaults = {
useCamera: false,
backgroundColor: [0, 0, 0], // The color "behind" the glyphs
volumetric: false, // A mode where the raindrops appear in perspective
resurrectingCodeRatio: 0, // The percent of columns that flow upward
animationSpeed: 1, // The global rate that all animations progress
forwardSpeed: 0.25, // The speed volumetric rain approaches the eye
bloomStrength: 0.7, // The intensity of the bloom
@@ -172,17 +171,7 @@ const versions = {
raindropLength: 0.4,
},
resurrections: {
resurrectingCodeRatio: 0.25,
glyphVerticalSpacing: 1.5,
effect: "resurrections",
numColumns: 100,
volumetric: true,
fallSpeed: 0.4,
},
updated: {
font: "resurrections",
bloomStrength:1,
bloomSize:0.6,
numColumns: 70,
cycleStyleName: "cycleRandomly",
cycleSpeed: 0.15,
@@ -191,9 +180,7 @@ const versions = {
{ hsl: [0.38, 1.0, 0.6], at: 0.92 },
{ hsl: [0.38, 1.0, 1.0], at: 1.0 },
],
raindropLength: 1.4,
highPassThreshold: 0.2,
cursorEffectThreshold: 0.8,
raindropLength: 1.4
},
palimpsest: {
font: "huberfishA",
@@ -253,6 +240,7 @@ const versions = {
},
};
versions.throwback = versions.operator;
versions.updated = versions.resurrections;
versions["1999"] = versions.operator;
versions["2003"] = versions.classic;
versions["2021"] = versions.resurrections;

3
js/regl/main.js
View File

@@ -5,7 +5,6 @@ import makeBloomPass from "./bloomPass.js";
import makePalettePass from "./palettePass.js";
import makeStripePass from "./stripePass.js";
import makeImagePass from "./imagePass.js";
import makeResurrectionPass from "./resurrectionPass.js";
import makeQuiltPass from "./quiltPass.js";
import makeMirrorPass from "./mirrorPass.js";
import { setupCamera, cameraCanvas, cameraAspectRatio } from "../camera.js";
@@ -20,8 +19,6 @@ const effects = {
transPride: makeStripePass,
trans: makeStripePass,
image: makeImagePass,
resurrection: makeResurrectionPass,
resurrections: makeResurrectionPass,
mirror: makeMirrorPass,
};

2
js/regl/rainPass.js
View File

@@ -40,7 +40,7 @@ export default ({ regl, config, lkg }) => {
const showComputationTexture = config.effect === "none";
const commonUniforms = {
...extractEntries(config, ["animationSpeed", "glyphHeightToWidth", "glyphSequenceLength", "glyphTextureGridSize", "resurrectingCodeRatio"]),
...extractEntries(config, ["animationSpeed", "glyphHeightToWidth", "glyphSequenceLength", "glyphTextureGridSize"]),
numColumns,
numRows,
showComputationTexture,

37
js/regl/resurrectionPass.js
View File

@@ -1,37 +0,0 @@
import { loadText, make1DTexture, makePassFBO, makePass } from "./utils.js";
// Matrix Resurrections isn't in theaters yet,
// and this version of the effect is still a WIP.
// Criteria:
// Upward-flowing glyphs should be golden
// Downward-flowing glyphs should be tinted slightly blue on top and golden on the bottom
// Cheat a lens blur, interpolating between the texture and bloom at the edges
export default ({ regl, config }, inputs) => {
const output = makePassFBO(regl, config.useHalfFloat);
const { backgroundColor, ditherMagnitude, bloomStrength } = config;
const resurrectionPassFrag = loadText("shaders/glsl/resurrectionPass.frag.glsl");
const render = regl({
frag: regl.prop("frag"),
uniforms: {
backgroundColor,
ditherMagnitude,
bloomStrength,
tex: inputs.primary,
bloomTex: inputs.bloom,
},
framebuffer: output,
});
return makePass(
{
primary: output,
},
resurrectionPassFrag.loaded,
(w, h) => output.resize(w, h),
() => render({ frag: resurrectionPassFrag.text() })
);
};

3
js/webgpu/main.js
View File

@@ -6,7 +6,6 @@ import makeBloomPass from "./bloomPass.js";
import makePalettePass from "./palettePass.js";
import makeStripePass from "./stripePass.js";
import makeImagePass from "./imagePass.js";
import makeResurrectionPass from "./resurrectionPass.js";
import makeMirrorPass from "./mirrorPass.js";
import makeEndPass from "./endPass.js";
import { setupCamera, cameraCanvas, cameraAspectRatio, cameraSize } from "../camera.js";
@@ -29,8 +28,6 @@ const effects = {
transPride: makeStripePass,
trans: makeStripePass,
image: makeImagePass,
resurrection: makeResurrectionPass,
resurrections: makeResurrectionPass,
mirror: makeMirrorPass,
};

74
js/webgpu/resurrectionPass.js
View File

@@ -1,74 +0,0 @@
import { structs } from "../../lib/gpu-buffer.js";
import { loadShader, makeUniformBuffer, makeComputeTarget, makeBindGroup, makePass } from "./utils.js";
// Matrix Resurrections isn't in theaters yet,
// and this version of the effect is still a WIP.
// Criteria:
// Upward-flowing glyphs should be golden
// Downward-flowing glyphs should be tinted slightly blue on top and golden on the bottom
// Cheat a lens blur, interpolating between the texture and bloom at the edges
const numVerticesPerQuad = 2 * 3;
export default ({ config, device, timeBuffer }) => {
const linearSampler = device.createSampler({
magFilter: "linear",
minFilter: "linear",
});
let computePipeline;
let configBuffer;
let computeBindGroup;
let output;
let screenSize;
const assets = [loadShader(device, "shaders/wgsl/resurrectionPass.wgsl")];
const loaded = (async () => {
const [resurrectionShader] = await Promise.all(assets);
computePipeline = device.createComputePipeline({
compute: {
module: resurrectionShader.module,
entryPoint: "computeMain",
},
});
const configUniforms = structs.from(resurrectionShader.code).Config;
configBuffer = makeUniformBuffer(device, configUniforms, {
bloomStrength: config.bloomStrength,
ditherMagnitude: config.ditherMagnitude,
backgroundColor: config.backgroundColor,
});
})();
const build = (size, inputs) => {
output?.destroy();
output = makeComputeTarget(device, size);
screenSize = size;
computeBindGroup = makeBindGroup(device, computePipeline, 0, [
configBuffer,
timeBuffer,
linearSampler,
inputs.primary.createView(),
inputs.bloom.createView(),
output.createView(),
]);
return {
primary: output,
};
};
const run = (encoder) => {
const computePass = encoder.beginComputePass();
computePass.setPipeline(computePipeline);
computePass.setBindGroup(0, computeBindGroup);
computePass.dispatchWorkgroups(Math.ceil(screenSize[0] / 32), screenSize[1], 1);
computePass.end();
};
return makePass(loaded, build, run);
};