Consolidating the version presets

This commit is contained in:
Rezmason
2020-01-26 09:55:37 -08:00
parent 99ef8bbf0a
commit 9a8638976d

View File

@@ -17,123 +17,54 @@ const fonts = {
};
const defaults = {
// TODO
bloomRadius: 0.5,
bloomStrength: 1,
highPassThreshold: 0.3,
cycleSpeed: 1,
cycleStyleName: "cycleFasterWhenDimmed",
cursorEffectThreshold: 1,
brightnessOffset: 0.0,
brightnessMultiplier: 1.0,
brightnessMix: 1.0,
brightnessMinimum: 0,
fallSpeed: 1,
glyphEdgeCrop: 0.0,
glyphHeightToWidth: 1,
hasSun: false,
hasThunder: false,
isPolar: false,
rippleTypeName: null,
rippleThickness: 0.2,
rippleScale: 30,
rippleSpeed: 0.2,
numColumns: 80,
paletteEntries: [
{ rgb: [0.0, 0.0, 0.0], at: 0.0 },
{ rgb: [0.023, 0.062, 0.031], at: 0.0625 },
{ rgb: [0.043, 0.109, 0.058], at: 0.125 },
{ rgb: [0.066, 0.16, 0.09], at: 0.1875 },
{ rgb: [0.078, 0.227, 0.121], at: 0.25 },
{ rgb: [0.09, 0.329, 0.152], at: 0.3125 },
{ rgb: [0.117, 0.443, 0.188], at: 0.375 },
{ rgb: [0.168, 0.556, 0.235], at: 0.4375 },
{ rgb: [0.223, 0.627, 0.282], at: 0.5 },
{ rgb: [0.274, 0.686, 0.317], at: 0.5625 },
{ rgb: [0.294, 0.733, 0.333], at: 0.625 },
{ rgb: [0.305, 0.768, 0.356], at: 0.6875 },
{ rgb: [0.325, 0.796, 0.4], at: 0.75 },
{ rgb: [0.36, 0.831, 0.447], at: 0.8125 },
{ rgb: [0.427, 0.874, 0.509], at: 0.875 },
{ rgb: [0.505, 0.909, 0.58], at: 0.9375 },
{ rgb: [0.549, 0.921, 0.615], at: 1.0 }
],
raindropLength: 1,
slant: 0
};
const versions = {
paradise: {
...defaults,
...fonts.coptic,
bloomRadius: 1.15,
bloomStrength: 1.75,
highPassThreshold: 0,
cycleSpeed: 0.1,
cycleStyleName: "cycleFasterWhenDimmed",
cursorEffectThreshold: 1,
brightnessOffset: 0.0,
brightnessMultiplier: 1.0,
brightnessMix: 0.05,
brightnessMinimum: 0,
fallSpeed: 0.08,
glyphEdgeCrop: 0.0,
glyphHeightToWidth: 1,
hasSun: true,
hasThunder: false,
isPolar: true,
rippleTypeName: "circle",
rippleThickness: 0.2,
rippleScale: 30,
rippleSpeed: 0.1,
numColumns: 30,
paletteEntries: [
{ rgb: [0.0, 0.0, 0.0], at: 0.0 },
{ rgb: [0.52, 0.17, 0.05], at: 0.4 },
{ rgb: [0.82, 0.37, 0.12], at: 0.7 },
{ rgb: [1.0, 0.74, 0.29], at: 0.9 },
{ rgb: [1.0, 0.9, 0.8], at: 1.0 }
],
raindropLength: 0.4,
slant: 0
},
nightmare: {
...defaults,
...fonts.gothic,
bloomRadius: 0.8,
bloomStrength: 1,
highPassThreshold: 0.7,
cycleSpeed: 1,
cycleStyleName: "cycleFasterWhenDimmed",
cursorEffectThreshold: 1,
brightnessOffset: 0.0,
brightnessMultiplier: 1.0,
brightnessMix: 0.75,
brightnessMinimum: 0,
fallSpeed: 2.0,
glyphEdgeCrop: 0.0,
glyphHeightToWidth: 1,
hasSun: false,
hasThunder: true,
isPolar: false,
rippleTypeName: null,
rippleThickness: 0.2,
rippleScale: 30,
rippleSpeed: 0.2,
numColumns: 60,
paletteEntries: [
{ rgb: [0.0, 0.0, 0.0], at: 0.0 },
{ rgb: [0.32, 0.06, 0.0], at: 0.2 },
{ rgb: [0.82, 0.06, 0.05], at: 0.4 },
{ rgb: [1.0, 0.6, 0.3], at: 0.8 },
{ rgb: [1.0, 1.0, 0.9], at: 1.0 }
],
raindropLength: 0.6,
slant: 360 / 16
},
classic: {
...defaults,
...fonts.matrixcode,
bloomRadius: 0.5,
bloomStrength: 1,
highPassThreshold: 0.3,
cycleSpeed: 1,
cycleStyleName: "cycleFasterWhenDimmed",
cursorEffectThreshold: 1,
brightnessOffset: 0.0,
brightnessMultiplier: 1.0,
brightnessMix: 1.0,
brightnessMinimum: 0,
fallSpeed: 1,
glyphEdgeCrop: 0.0,
glyphHeightToWidth: 1,
hasSun: false,
hasThunder: false,
isPolar: false,
rippleTypeName: null,
rippleThickness: 0.2,
rippleScale: 30,
rippleSpeed: 0.2,
numColumns: 80,
paletteEntries: [
{ rgb: [0 / 255, 0 / 255, 0 / 255], at: 0 / 16 },
{ rgb: [6 / 255, 16 / 255, 8 / 255], at: 1 / 16 },
{ rgb: [11 / 255, 28 / 255, 15 / 255], at: 2 / 16 },
{ rgb: [17 / 255, 41 / 255, 23 / 255], at: 3 / 16 },
{ rgb: [20 / 255, 58 / 255, 31 / 255], at: 4 / 16 },
{ rgb: [23 / 255, 84 / 255, 39 / 255], at: 5 / 16 },
{ rgb: [30 / 255, 113 / 255, 48 / 255], at: 6 / 16 },
{ rgb: [43 / 255, 142 / 255, 60 / 255], at: 7 / 16 },
{ rgb: [57 / 255, 160 / 255, 72 / 255], at: 8 / 16 },
{ rgb: [70 / 255, 175 / 255, 81 / 255], at: 9 / 16 },
{ rgb: [75 / 255, 187 / 255, 85 / 255], at: 10 / 16 },
{ rgb: [78 / 255, 196 / 255, 91 / 255], at: 11 / 16 },
{ rgb: [83 / 255, 203 / 255, 102 / 255], at: 12 / 16 },
{ rgb: [92 / 255, 212 / 255, 114 / 255], at: 13 / 16 },
{ rgb: [109 / 255, 223 / 255, 130 / 255], at: 14 / 16 },
{ rgb: [129 / 255, 232 / 255, 148 / 255], at: 15 / 16 },
{ rgb: [140 / 255, 235 / 255, 157 / 255], at: 16 / 16 }
],
raindropLength: 1,
slant: 0
...fonts.matrixcode
},
operator: {
...defaults,
@@ -146,33 +77,65 @@ const versions = {
cursorEffectThreshold: 0.64,
brightnessOffset: 0.25,
brightnessMultiplier: 0.0,
brightnessMix: 1.0,
brightnessMinimum: -1.0,
fallSpeed: 0.65,
glyphEdgeCrop: 0.15,
glyphHeightToWidth: 1.35,
hasSun: false,
hasThunder: false,
isPolar: false,
rippleTypeName: "box",
rippleThickness: 0.2,
rippleScale: 30,
rippleSpeed: 0.2,
numColumns: 108,
paletteEntries: [
{ rgb: [0.0, 0.0, 0.0], at: 0.0 },
{ rgb: [0.18, 0.9, 0.35], at: 0.6 },
{ rgb: [0.9, 1.0, 0.9], at: 1.0 }
],
raindropLength: 1.5,
slant: 0
raindropLength: 1.5
},
nightmare: {
...defaults,
...fonts.gothic,
bloomRadius: 0.8,
highPassThreshold: 0.7,
brightnessMix: 0.75,
fallSpeed: 2.0,
hasThunder: true,
numColumns: 60,
paletteEntries: [
{ rgb: [0.0, 0.0, 0.0], at: 0.0 },
{ rgb: [0.32, 0.06, 0.0], at: 0.2 },
{ rgb: [0.82, 0.06, 0.05], at: 0.4 },
{ rgb: [1.0, 0.6, 0.3], at: 0.8 },
{ rgb: [1.0, 1.0, 0.9], at: 1.0 }
],
raindropLength: 0.6,
slant: 360 / 16
},
paradise: {
...defaults,
...fonts.coptic,
bloomRadius: 1.15,
bloomStrength: 1.75,
highPassThreshold: 0,
cycleSpeed: 0.1,
brightnessMix: 0.05,
fallSpeed: 0.08,
hasSun: true,
isPolar: true,
rippleTypeName: "circle",
rippleSpeed: 0.1,
numColumns: 30,
paletteEntries: [
{ rgb: [0.0, 0.0, 0.0], at: 0.0 },
{ rgb: [0.52, 0.17, 0.05], at: 0.4 },
{ rgb: [0.82, 0.37, 0.12], at: 0.7 },
{ rgb: [1.0, 0.74, 0.29], at: 0.9 },
{ rgb: [1.0, 0.9, 0.8], at: 1.0 }
],
raindropLength: 0.4
}
};
versions.throwback = versions.operator;
versions["1999"] = versions.classic;
// Start here
export default (searchString, make1DTexture) => {
const urlParams = new URLSearchParams(searchString);
const getParam = (keyOrKeys, defaultValue) => {
@@ -187,7 +150,8 @@ export default (searchString, make1DTexture) => {
};
const versionName = getParam("version", "classic");
const version = versions[versionName] == null ? versions.classic : versions[versionName];
const version =
versions[versionName] == null ? versions.classic : versions[versionName];
const config = { ...version };
@@ -195,18 +159,38 @@ export default (searchString, make1DTexture) => {
config.fallSpeed *= parseFloat(getParam("fallSpeed", 1));
config.cycleSpeed *= parseFloat(getParam("cycleSpeed", 1));
config.numColumns = parseInt(getParam("width", config.numColumns));
config.raindropLength = parseFloat(getParam(["raindropLength", "dropLength"], config.raindropLength));
config.raindropLength = parseFloat(
getParam(["raindropLength", "dropLength"], config.raindropLength)
);
config.glyphSequenceLength = config.glyphSequenceLength;
config.slant = (parseFloat(getParam(["slant", "angle"], config.slant)) * Math.PI) / 180;
config.slant =
(parseFloat(getParam(["slant", "angle"], config.slant)) * Math.PI) / 180;
config.slantVec = [Math.cos(config.slant), Math.sin(config.slant)];
config.slantScale = 1 / (Math.abs(Math.sin(2 * config.slant)) * (Math.sqrt(2) - 1) + 1);
config.slantScale =
1 / (Math.abs(Math.sin(2 * config.slant)) * (Math.sqrt(2) - 1) + 1);
config.glyphEdgeCrop = parseFloat(getParam("encroach", config.glyphEdgeCrop));
config.glyphHeightToWidth = parseFloat(getParam("stretch", config.glyphHeightToWidth));
config.cursorEffectThreshold = getParam("cursorEffectThreshold", config.cursorEffectThreshold);
config.bloomSize = Math.max(0.01, Math.min(1, parseFloat(getParam("bloomSize", 0.5))));
config.glyphHeightToWidth = parseFloat(
getParam("stretch", config.glyphHeightToWidth)
);
config.cursorEffectThreshold = getParam(
"cursorEffectThreshold",
config.cursorEffectThreshold
);
config.bloomSize = Math.max(
0.01,
Math.min(1, parseFloat(getParam("bloomSize", 0.5)))
);
config.effect = getParam("effect", "plain");
config.bgURL = getParam("url", "https://upload.wikimedia.org/wikipedia/commons/0/0a/Flammarion_Colored.jpg");
config.customStripes = getParam("colors", "0.4,0.15,0.1,0.4,0.15,0.1,0.8,0.8,0.6,0.8,0.8,0.6,1.0,0.7,0.8,1.0,0.7,0.8,").split(",").map(parseFloat);
config.bgURL = getParam(
"url",
"https://upload.wikimedia.org/wikipedia/commons/0/0a/Flammarion_Colored.jpg"
);
config.customStripes = getParam(
"colors",
"0.4,0.15,0.1,0.4,0.15,0.1,0.8,0.8,0.6,0.8,0.8,0.6,1.0,0.7,0.8,1.0,0.7,0.8,"
)
.split(",")
.map(parseFloat);
config.showComputationTexture = config.effect === "none";
switch (config.cycleStyleName) {