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

Cursors are now much more robustly detected, and the debug view— previously called the computation texture— now resembles BUF's behind-the-scenes VFX footage. Isolated the isometric camera option from the debug view

Browse Source
This commit is contained in:
Rezmason
2022-09-08 23:12:58 -07:00
parent 77d6176fd5
commit ed49105c69
8 changed files with 55 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
js/config.js
View File

@@ -96,6 +96,7 @@ const defaults = {
resolution: 0.75, // An overall scale multiplier
useHalfFloat: false,
renderer: "webgpu", // The preferred web graphics API
isometric: false,
useHoloplay: false,
loops: false,
};
@@ -308,6 +309,7 @@ const paramMapping = {
loops: { key: "loops", parser: (s) => s.toLowerCase().includes("true") },
renderer: { key: "renderer", parser: (s) => s },
once: { key: "once", parser: (s) => s.toLowerCase().includes("true") },
isometric: { key: "isometric", parser: (s) => s.toLowerCase().includes("true") },
};
paramMapping.dropLength = paramMapping.raindropLength;
paramMapping.angle = paramMapping.slant;

8
js/regl/rainPass.js
View File

@@ -37,13 +37,13 @@ export default ({ regl, config, lkg }) => {
const cycleStyle = config.cycleStyleName in cycleStyles ? cycleStyles[config.cycleStyleName] : 0;
const slantVec = [Math.cos(config.slant), Math.sin(config.slant)];
const slantScale = 1 / (Math.abs(Math.sin(2 * config.slant)) * (Math.sqrt(2) - 1) + 1);
const showComputationTexture = config.effect === "none";
const showDebugView = config.effect === "none";
const commonUniforms = {
...extractEntries(config, ["animationSpeed", "glyphHeightToWidth", "glyphSequenceLength", "glyphTextureGridSize"]),
numColumns,
numRows,
showComputationTexture,
showDebugView,
};
// These two framebuffers are used to compute the raining code.
@@ -182,7 +182,7 @@ export default ({ regl, config, lkg }) => {
const screenSize = [1, 1];
const { mat4, vec3 } = glMatrix;
const transform = mat4.create();
if (config.effect === "none") {
if (volumetric && config.isometric) {
mat4.rotateX(transform, transform, (Math.PI * 1) / 8);
mat4.rotateY(transform, transform, (Math.PI * 1) / 4);
mat4.translate(transform, transform, vec3.fromValues(0, 0, -1));
@@ -217,7 +217,7 @@ export default ({ regl, config, lkg }) => {
const index = column + row * numTileColumns;
const camera = mat4.create();
if (config.effect === "none") {
if (volumetric && config.isometric) {
if (aspectRatio > 1) {
mat4.ortho(camera, -1.5 * aspectRatio, 1.5 * aspectRatio, -1.5, 1.5, -1000, 1000);
} else {

6
js/webgpu/rainPass.js
View File

@@ -18,7 +18,7 @@ const makeConfigBuffer = (device, configUniforms, config, density, gridSize) =>
...config,
gridSize,
density,
showComputationTexture: config.effect === "none",
showDebugView: config.effect === "none",
cycleStyle: config.cycleStyleName in cycleStyles ? cycleStyles[config.cycleStyleName] : 0,
rippleType: config.rippleTypeName in rippleTypes ? rippleTypes[config.rippleTypeName] : -1,
slantScale: 1 / (Math.abs(Math.sin(2 * config.slant)) * (Math.sqrt(2) - 1) + 1),
@@ -45,7 +45,7 @@ export default ({ config, device, timeBuffer }) => {
const numQuads = config.volumetric ? numCells : 1;
const transform = mat4.create();
if (config.effect === "none") {
if (config.volumetric && config.isometric) {
mat4.rotateX(transform, transform, (Math.PI * 1) / 8);
mat4.rotateY(transform, transform, (Math.PI * 1) / 4);
mat4.translate(transform, transform, vec3.fromValues(0, 0, -1));
@@ -153,7 +153,7 @@ export default ({ config, device, timeBuffer }) => {
const build = (size) => {
// Update scene buffer: camera and transform math for the volumetric mode
const aspectRatio = size[0] / size[1];
if (config.effect === "none") {
if (config.volumetric && config.isometric) {
if (aspectRatio > 1) {
mat4.orthoZO(camera, -1.5 * aspectRatio, 1.5 * aspectRatio, -1.5, 1.5, -1000, 1000);
} else {