@remotion/effects 4.0.468 → 4.0.469

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,341 @@
1
+ // src/noise.ts
2
+ import { Internals } from "remotion";
3
+
4
+ // src/validate-effect-param.ts
5
+ var assertEffectParamsObject = (params, effectLabel) => {
6
+ if (params === null || typeof params !== "object") {
7
+ throw new TypeError(`${effectLabel} effect requires a parameters object, but got ${JSON.stringify(params)}`);
8
+ }
9
+ };
10
+ var assertRequiredFiniteNumber = (value, name) => {
11
+ if (typeof value !== "number" || !Number.isFinite(value)) {
12
+ throw new TypeError(`"${name}" must be a finite number, but got ${JSON.stringify(value)}`);
13
+ }
14
+ };
15
+ var assertRequiredColor = (value, name) => {
16
+ if (typeof value !== "string" || value.length === 0) {
17
+ throw new TypeError(`"${name}" must be a non-empty string, but got ${JSON.stringify(value)}`);
18
+ }
19
+ };
20
+ var assertOptionalColor = (value, name) => {
21
+ if (value === undefined) {
22
+ return;
23
+ }
24
+ assertRequiredColor(value, name);
25
+ };
26
+
27
+ // src/color-utils.ts
28
+ var DEFAULT_AMOUNT = 1;
29
+ var DEFAULT_BRIGHTNESS_AMOUNT = 0;
30
+ var DEFAULT_HUE_DEGREES = 0;
31
+ var colorAmountSchema = {
32
+ type: "number",
33
+ min: 0,
34
+ max: 1,
35
+ step: 0.01,
36
+ default: DEFAULT_AMOUNT,
37
+ description: "Amount"
38
+ };
39
+ var colorMultiplierSchema = {
40
+ type: "number",
41
+ min: 0,
42
+ step: 0.01,
43
+ default: DEFAULT_AMOUNT,
44
+ description: "Amount"
45
+ };
46
+ var brightnessAmountSchema = {
47
+ type: "number",
48
+ min: -1,
49
+ max: 1,
50
+ step: 0.01,
51
+ default: DEFAULT_BRIGHTNESS_AMOUNT,
52
+ description: "Amount"
53
+ };
54
+ var hueDegreesSchema = {
55
+ type: "number",
56
+ step: 1,
57
+ default: DEFAULT_HUE_DEGREES,
58
+ description: "Degrees"
59
+ };
60
+ var assertOptionalFiniteNumber = (value, name) => {
61
+ if (value === undefined) {
62
+ return;
63
+ }
64
+ assertRequiredFiniteNumber(value, name);
65
+ };
66
+ var validateUnitInterval = (value, name) => {
67
+ if (value < 0) {
68
+ throw new TypeError(`"${name}" must be >= 0, but got ${JSON.stringify(value)}`);
69
+ }
70
+ if (value > 1) {
71
+ throw new TypeError(`"${name}" must be <= 1, but got ${JSON.stringify(value)}`);
72
+ }
73
+ };
74
+ var validateNonNegative = (value, name) => {
75
+ if (value < 0) {
76
+ throw new TypeError(`"${name}" must be >= 0, but got ${JSON.stringify(value)}`);
77
+ }
78
+ };
79
+ var validateSignedUnitInterval = (value, name) => {
80
+ if (value < -1) {
81
+ throw new TypeError(`"${name}" must be >= -1, but got ${JSON.stringify(value)}`);
82
+ }
83
+ if (value > 1) {
84
+ throw new TypeError(`"${name}" must be <= 1, but got ${JSON.stringify(value)}`);
85
+ }
86
+ };
87
+ var clampColorChannel = (value) => {
88
+ return Math.max(0, Math.min(255, value));
89
+ };
90
+ var parseColorRgba = (ctx, color) => {
91
+ ctx.clearRect(0, 0, 1, 1);
92
+ ctx.fillStyle = color;
93
+ ctx.fillRect(0, 0, 1, 1);
94
+ const { data } = ctx.getImageData(0, 0, 1, 1);
95
+ return [data[0], data[1], data[2], data[3]];
96
+ };
97
+
98
+ // src/noise.ts
99
+ var { createEffect, createWebGL2ContextError } = Internals;
100
+ var DEFAULT_AMOUNT2 = 0.15;
101
+ var DEFAULT_SEED = 0;
102
+ var DEFAULT_PREMULTIPLY = false;
103
+ var noiseSchema = {
104
+ amount: {
105
+ type: "number",
106
+ min: 0,
107
+ max: 1,
108
+ step: 0.01,
109
+ default: DEFAULT_AMOUNT2,
110
+ description: "Amount"
111
+ },
112
+ seed: {
113
+ type: "number",
114
+ step: 1,
115
+ default: DEFAULT_SEED,
116
+ description: "Seed"
117
+ },
118
+ premultiply: {
119
+ type: "boolean",
120
+ default: DEFAULT_PREMULTIPLY,
121
+ description: "Premultiply"
122
+ }
123
+ };
124
+ var resolve = (p) => ({
125
+ amount: p.amount ?? DEFAULT_AMOUNT2,
126
+ seed: p.seed ?? DEFAULT_SEED,
127
+ premultiply: p.premultiply ?? DEFAULT_PREMULTIPLY
128
+ });
129
+ var assertOptionalBoolean = (value, name) => {
130
+ if (value === undefined) {
131
+ return;
132
+ }
133
+ if (typeof value !== "boolean") {
134
+ throw new TypeError(`"${name}" must be a boolean, but got ${JSON.stringify(value)}`);
135
+ }
136
+ };
137
+ var validateNoiseParams = (params) => {
138
+ assertEffectParamsObject(params, "Noise");
139
+ assertOptionalFiniteNumber(params.amount, "amount");
140
+ assertOptionalFiniteNumber(params.seed, "seed");
141
+ assertOptionalBoolean(params.premultiply, "premultiply");
142
+ const r = resolve(params);
143
+ validateUnitInterval(r.amount, "amount");
144
+ };
145
+ var NOISE_VS = `#version 300 es
146
+ in vec2 aPos;
147
+ in vec2 aUv;
148
+ out vec2 vUv;
149
+
150
+ void main() {
151
+ vUv = aUv;
152
+ gl_Position = vec4(aPos, 0.0, 1.0);
153
+ }
154
+ `;
155
+ var NOISE_FS = `#version 300 es
156
+ precision highp float;
157
+
158
+ in vec2 vUv;
159
+ out vec4 fragColor;
160
+
161
+ uniform sampler2D uSource;
162
+ uniform vec2 uResolution;
163
+ uniform float uAmount;
164
+ uniform float uSeed;
165
+ uniform bool uPremultiply;
166
+
167
+ float random(vec2 co) {
168
+ vec3 p3 = fract(vec3(co.xyx) * 0.1031 + uSeed * 0.0973);
169
+ p3 += dot(p3, p3.yzx + 33.33);
170
+ return fract((p3.x + p3.y) * p3.z);
171
+ }
172
+
173
+ void main() {
174
+ vec4 texColor = texture(uSource, vUv);
175
+ float alpha = texColor.a;
176
+
177
+ if (alpha <= 0.001) {
178
+ fragColor = vec4(0.0);
179
+ return;
180
+ }
181
+
182
+ float noise = random(gl_FragCoord.xy) - 0.5;
183
+ vec3 rgb = texColor.rgb / alpha;
184
+ vec3 noiseLayer = uPremultiply ? rgb * noise : vec3(noise);
185
+ rgb = clamp(rgb + noiseLayer * uAmount, 0.0, 1.0);
186
+ fragColor = vec4(rgb * alpha, alpha);
187
+ }
188
+ `;
189
+ var compileShader = (gl, type, source) => {
190
+ const shader = gl.createShader(type);
191
+ if (!shader) {
192
+ throw new Error("Failed to create WebGL shader");
193
+ }
194
+ gl.shaderSource(shader, source);
195
+ gl.compileShader(shader);
196
+ if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
197
+ const log = gl.getShaderInfoLog(shader);
198
+ gl.deleteShader(shader);
199
+ throw new Error(`Noise shader compile failed: ${log ?? "(no log)"}`);
200
+ }
201
+ return shader;
202
+ };
203
+ var linkProgram = (gl, vs, fs) => {
204
+ const program = gl.createProgram();
205
+ if (!program) {
206
+ throw new Error("Failed to create WebGL program");
207
+ }
208
+ gl.attachShader(program, vs);
209
+ gl.attachShader(program, fs);
210
+ gl.linkProgram(program);
211
+ if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
212
+ const log = gl.getProgramInfoLog(program);
213
+ gl.deleteProgram(program);
214
+ throw new Error(`Noise program link failed: ${log ?? "(no log)"}`);
215
+ }
216
+ return program;
217
+ };
218
+ var setupNoise = (target) => {
219
+ const gl = target.getContext("webgl2", {
220
+ premultipliedAlpha: true,
221
+ alpha: true,
222
+ preserveDrawingBuffer: true
223
+ });
224
+ if (!gl) {
225
+ throw createWebGL2ContextError("noise effect");
226
+ }
227
+ gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, true);
228
+ const vs = compileShader(gl, gl.VERTEX_SHADER, NOISE_VS);
229
+ const fs = compileShader(gl, gl.FRAGMENT_SHADER, NOISE_FS);
230
+ const program = linkProgram(gl, vs, fs);
231
+ gl.deleteShader(vs);
232
+ gl.deleteShader(fs);
233
+ const vao = gl.createVertexArray();
234
+ if (!vao) {
235
+ throw new Error("Failed to create WebGL vertex array");
236
+ }
237
+ gl.bindVertexArray(vao);
238
+ const data = new Float32Array([
239
+ -1,
240
+ -1,
241
+ 0,
242
+ 0,
243
+ 1,
244
+ -1,
245
+ 1,
246
+ 0,
247
+ -1,
248
+ 1,
249
+ 0,
250
+ 1,
251
+ 1,
252
+ 1,
253
+ 1,
254
+ 1
255
+ ]);
256
+ const vbo = gl.createBuffer();
257
+ if (!vbo) {
258
+ throw new Error("Failed to create WebGL buffer");
259
+ }
260
+ gl.bindBuffer(gl.ARRAY_BUFFER, vbo);
261
+ gl.bufferData(gl.ARRAY_BUFFER, data, gl.STATIC_DRAW);
262
+ const aPos = gl.getAttribLocation(program, "aPos");
263
+ const aUv = gl.getAttribLocation(program, "aUv");
264
+ gl.enableVertexAttribArray(aPos);
265
+ gl.vertexAttribPointer(aPos, 2, gl.FLOAT, false, 16, 0);
266
+ gl.enableVertexAttribArray(aUv);
267
+ gl.vertexAttribPointer(aUv, 2, gl.FLOAT, false, 16, 8);
268
+ gl.bindVertexArray(null);
269
+ const texture = gl.createTexture();
270
+ if (!texture) {
271
+ throw new Error("Failed to create WebGL texture");
272
+ }
273
+ gl.bindTexture(gl.TEXTURE_2D, texture);
274
+ gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
275
+ gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
276
+ gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
277
+ gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
278
+ gl.bindTexture(gl.TEXTURE_2D, null);
279
+ return {
280
+ gl,
281
+ program,
282
+ vao,
283
+ vbo,
284
+ texture,
285
+ uSource: gl.getUniformLocation(program, "uSource"),
286
+ uResolution: gl.getUniformLocation(program, "uResolution"),
287
+ uAmount: gl.getUniformLocation(program, "uAmount"),
288
+ uSeed: gl.getUniformLocation(program, "uSeed"),
289
+ uPremultiply: gl.getUniformLocation(program, "uPremultiply")
290
+ };
291
+ };
292
+ var noise = createEffect({
293
+ type: "remotion/noise",
294
+ label: "noise()",
295
+ documentationLink: "https://www.remotion.dev/docs/effects/noise",
296
+ backend: "webgl2",
297
+ calculateKey: (params) => {
298
+ const r = resolve(params);
299
+ return `noise-${r.amount}-${r.seed}-${r.premultiply ? 1 : 0}`;
300
+ },
301
+ setup: (target) => setupNoise(target),
302
+ apply: ({ source, width, height, params, state, flipSourceY }) => {
303
+ const r = resolve(params);
304
+ const { gl, program, texture, vao } = state;
305
+ gl.viewport(0, 0, width, height);
306
+ gl.bindFramebuffer(gl.FRAMEBUFFER, null);
307
+ gl.clearColor(0, 0, 0, 0);
308
+ gl.clear(gl.COLOR_BUFFER_BIT);
309
+ gl.activeTexture(gl.TEXTURE0);
310
+ gl.bindTexture(gl.TEXTURE_2D, texture);
311
+ gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, flipSourceY);
312
+ gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, source);
313
+ gl.useProgram(program);
314
+ if (state.uSource)
315
+ gl.uniform1i(state.uSource, 0);
316
+ if (state.uResolution)
317
+ gl.uniform2f(state.uResolution, width, height);
318
+ if (state.uAmount)
319
+ gl.uniform1f(state.uAmount, r.amount);
320
+ if (state.uSeed)
321
+ gl.uniform1f(state.uSeed, r.seed);
322
+ if (state.uPremultiply)
323
+ gl.uniform1i(state.uPremultiply, r.premultiply ? 1 : 0);
324
+ gl.bindVertexArray(vao);
325
+ gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
326
+ gl.bindVertexArray(null);
327
+ gl.bindTexture(gl.TEXTURE_2D, null);
328
+ gl.useProgram(null);
329
+ },
330
+ cleanup: ({ gl, program, vao, vbo, texture }) => {
331
+ gl.deleteTexture(texture);
332
+ gl.deleteBuffer(vbo);
333
+ gl.deleteProgram(program);
334
+ gl.deleteVertexArray(vao);
335
+ },
336
+ schema: noiseSchema,
337
+ validateParams: validateNoiseParams
338
+ });
339
+ export {
340
+ noise
341
+ };
@@ -0,0 +1,360 @@
1
+ // src/speckle.ts
2
+ import { Internals } from "remotion";
3
+
4
+ // src/validate-effect-param.ts
5
+ var assertEffectParamsObject = (params, effectLabel) => {
6
+ if (params === null || typeof params !== "object") {
7
+ throw new TypeError(`${effectLabel} effect requires a parameters object, but got ${JSON.stringify(params)}`);
8
+ }
9
+ };
10
+ var assertRequiredFiniteNumber = (value, name) => {
11
+ if (typeof value !== "number" || !Number.isFinite(value)) {
12
+ throw new TypeError(`"${name}" must be a finite number, but got ${JSON.stringify(value)}`);
13
+ }
14
+ };
15
+ var assertRequiredColor = (value, name) => {
16
+ if (typeof value !== "string" || value.length === 0) {
17
+ throw new TypeError(`"${name}" must be a non-empty string, but got ${JSON.stringify(value)}`);
18
+ }
19
+ };
20
+ var assertOptionalColor = (value, name) => {
21
+ if (value === undefined) {
22
+ return;
23
+ }
24
+ assertRequiredColor(value, name);
25
+ };
26
+
27
+ // src/color-utils.ts
28
+ var DEFAULT_AMOUNT = 1;
29
+ var DEFAULT_BRIGHTNESS_AMOUNT = 0;
30
+ var DEFAULT_HUE_DEGREES = 0;
31
+ var colorAmountSchema = {
32
+ type: "number",
33
+ min: 0,
34
+ max: 1,
35
+ step: 0.01,
36
+ default: DEFAULT_AMOUNT,
37
+ description: "Amount"
38
+ };
39
+ var colorMultiplierSchema = {
40
+ type: "number",
41
+ min: 0,
42
+ step: 0.01,
43
+ default: DEFAULT_AMOUNT,
44
+ description: "Amount"
45
+ };
46
+ var brightnessAmountSchema = {
47
+ type: "number",
48
+ min: -1,
49
+ max: 1,
50
+ step: 0.01,
51
+ default: DEFAULT_BRIGHTNESS_AMOUNT,
52
+ description: "Amount"
53
+ };
54
+ var hueDegreesSchema = {
55
+ type: "number",
56
+ step: 1,
57
+ default: DEFAULT_HUE_DEGREES,
58
+ description: "Degrees"
59
+ };
60
+ var assertOptionalFiniteNumber = (value, name) => {
61
+ if (value === undefined) {
62
+ return;
63
+ }
64
+ assertRequiredFiniteNumber(value, name);
65
+ };
66
+ var validateUnitInterval = (value, name) => {
67
+ if (value < 0) {
68
+ throw new TypeError(`"${name}" must be >= 0, but got ${JSON.stringify(value)}`);
69
+ }
70
+ if (value > 1) {
71
+ throw new TypeError(`"${name}" must be <= 1, but got ${JSON.stringify(value)}`);
72
+ }
73
+ };
74
+ var validateNonNegative = (value, name) => {
75
+ if (value < 0) {
76
+ throw new TypeError(`"${name}" must be >= 0, but got ${JSON.stringify(value)}`);
77
+ }
78
+ };
79
+ var validateSignedUnitInterval = (value, name) => {
80
+ if (value < -1) {
81
+ throw new TypeError(`"${name}" must be >= -1, but got ${JSON.stringify(value)}`);
82
+ }
83
+ if (value > 1) {
84
+ throw new TypeError(`"${name}" must be <= 1, but got ${JSON.stringify(value)}`);
85
+ }
86
+ };
87
+ var clampColorChannel = (value) => {
88
+ return Math.max(0, Math.min(255, value));
89
+ };
90
+ var parseColorRgba = (ctx, color) => {
91
+ ctx.clearRect(0, 0, 1, 1);
92
+ ctx.fillStyle = color;
93
+ ctx.fillRect(0, 0, 1, 1);
94
+ const { data } = ctx.getImageData(0, 0, 1, 1);
95
+ return [data[0], data[1], data[2], data[3]];
96
+ };
97
+
98
+ // src/speckle.ts
99
+ var { createEffect, createWebGL2ContextError } = Internals;
100
+ var DEFAULT_DENSITY = 0.08;
101
+ var DEFAULT_SIZE = 4;
102
+ var DEFAULT_RANDOMNESS = 1;
103
+ var speckleSchema = {
104
+ density: {
105
+ type: "number",
106
+ min: 0,
107
+ max: 1,
108
+ step: 0.01,
109
+ default: DEFAULT_DENSITY,
110
+ description: "Density"
111
+ },
112
+ size: {
113
+ type: "number",
114
+ min: 0,
115
+ max: 50,
116
+ step: 0.1,
117
+ default: DEFAULT_SIZE,
118
+ description: "Size"
119
+ },
120
+ randomness: {
121
+ type: "number",
122
+ min: 0,
123
+ max: 1,
124
+ step: 0.01,
125
+ default: DEFAULT_RANDOMNESS,
126
+ description: "Randomness"
127
+ }
128
+ };
129
+ var resolve = (p) => ({
130
+ density: p.density ?? DEFAULT_DENSITY,
131
+ size: p.size ?? DEFAULT_SIZE,
132
+ randomness: p.randomness ?? DEFAULT_RANDOMNESS
133
+ });
134
+ var validateSpeckleParams = (params) => {
135
+ assertEffectParamsObject(params, "Speckle");
136
+ assertOptionalFiniteNumber(params.density, "density");
137
+ assertOptionalFiniteNumber(params.size, "size");
138
+ assertOptionalFiniteNumber(params.randomness, "randomness");
139
+ const r = resolve(params);
140
+ validateUnitInterval(r.density, "density");
141
+ validateNonNegative(r.size, "size");
142
+ validateUnitInterval(r.randomness, "randomness");
143
+ };
144
+ var SPECKLE_VS = `#version 300 es
145
+ in vec2 aPos;
146
+ in vec2 aUv;
147
+ out vec2 vUv;
148
+
149
+ void main() {
150
+ vUv = aUv;
151
+ gl_Position = vec4(aPos, 0.0, 1.0);
152
+ }
153
+ `;
154
+ var SPECKLE_FS = `#version 300 es
155
+ precision highp float;
156
+
157
+ in vec2 vUv;
158
+ out vec4 fragColor;
159
+
160
+ uniform sampler2D uSource;
161
+ uniform vec2 uResolution;
162
+ uniform float uDensity;
163
+ uniform float uSize;
164
+ uniform float uRandomness;
165
+
166
+ float hash21(vec2 p) {
167
+ vec3 p3 = fract(vec3(p.xyx) * vec3(443.8975, 397.2973, 491.1871));
168
+ p3 += dot(p3, p3.yzx + 19.19);
169
+ return fract((p3.x + p3.y) * p3.z);
170
+ }
171
+
172
+ vec2 hash22(vec2 p) {
173
+ return vec2(hash21(p + 17.13), hash21(p + 83.71));
174
+ }
175
+
176
+ void main() {
177
+ vec4 color = texture(uSource, vUv);
178
+
179
+ if (uDensity <= 0.0 || uSize <= 0.0) {
180
+ fragColor = color;
181
+ return;
182
+ }
183
+
184
+ vec2 fragPos = vUv * uResolution;
185
+ float cellSize = max(uSize * 2.5, 1.0);
186
+ vec2 baseCell = floor(fragPos / cellSize);
187
+ float hole = 0.0;
188
+
189
+ for (int y = -1; y <= 1; y++) {
190
+ for (int x = -1; x <= 1; x++) {
191
+ vec2 cell = baseCell + vec2(float(x), float(y));
192
+ float chance = hash21(cell);
193
+
194
+ if (chance <= uDensity) {
195
+ vec2 randomOffset = (hash22(cell + 11.7) - 0.5) * uRandomness;
196
+ vec2 center = (cell + 0.5 + randomOffset) * cellSize;
197
+ float sizeVariation = mix(1.0, 0.35 + hash21(cell + 29.43) * 0.65, uRandomness);
198
+ float radius = uSize * 0.5 * sizeVariation;
199
+ float edge = min(1.0, max(radius * 0.5, 0.35));
200
+ float coverage = 1.0 - smoothstep(radius - edge, radius + edge, length(fragPos - center));
201
+ hole = max(hole, coverage);
202
+ }
203
+ }
204
+ }
205
+
206
+ fragColor = color * (1.0 - clamp(hole, 0.0, 1.0));
207
+ }
208
+ `;
209
+ var compileShader = (gl, type, source) => {
210
+ const shader = gl.createShader(type);
211
+ if (!shader) {
212
+ throw new Error("Failed to create WebGL shader");
213
+ }
214
+ gl.shaderSource(shader, source);
215
+ gl.compileShader(shader);
216
+ if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
217
+ const log = gl.getShaderInfoLog(shader);
218
+ gl.deleteShader(shader);
219
+ throw new Error(`Speckle shader compile failed: ${log ?? "(no log)"}`);
220
+ }
221
+ return shader;
222
+ };
223
+ var linkProgram = (gl, vs, fs) => {
224
+ const program = gl.createProgram();
225
+ if (!program) {
226
+ throw new Error("Failed to create WebGL program");
227
+ }
228
+ gl.attachShader(program, vs);
229
+ gl.attachShader(program, fs);
230
+ gl.linkProgram(program);
231
+ if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
232
+ const log = gl.getProgramInfoLog(program);
233
+ gl.deleteProgram(program);
234
+ throw new Error(`Speckle program link failed: ${log ?? "(no log)"}`);
235
+ }
236
+ return program;
237
+ };
238
+ var speckle = createEffect({
239
+ type: "remotion/speckle",
240
+ label: "speckle()",
241
+ documentationLink: "https://www.remotion.dev/docs/effects/speckle",
242
+ backend: "webgl2",
243
+ calculateKey: (params) => {
244
+ const r = resolve(params);
245
+ return `speckle-${r.density}-${r.size}-${r.randomness}`;
246
+ },
247
+ setup: (target) => {
248
+ const gl = target.getContext("webgl2", {
249
+ premultipliedAlpha: true,
250
+ alpha: true,
251
+ preserveDrawingBuffer: true
252
+ });
253
+ if (!gl) {
254
+ throw createWebGL2ContextError("speckle effect");
255
+ }
256
+ gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, true);
257
+ const vs = compileShader(gl, gl.VERTEX_SHADER, SPECKLE_VS);
258
+ const fs = compileShader(gl, gl.FRAGMENT_SHADER, SPECKLE_FS);
259
+ const program = linkProgram(gl, vs, fs);
260
+ gl.deleteShader(vs);
261
+ gl.deleteShader(fs);
262
+ const vao = gl.createVertexArray();
263
+ if (!vao) {
264
+ throw new Error("Failed to create WebGL vertex array");
265
+ }
266
+ gl.bindVertexArray(vao);
267
+ const data = new Float32Array([
268
+ -1,
269
+ -1,
270
+ 0,
271
+ 0,
272
+ 1,
273
+ -1,
274
+ 1,
275
+ 0,
276
+ -1,
277
+ 1,
278
+ 0,
279
+ 1,
280
+ 1,
281
+ 1,
282
+ 1,
283
+ 1
284
+ ]);
285
+ const vbo = gl.createBuffer();
286
+ if (!vbo) {
287
+ throw new Error("Failed to create WebGL buffer");
288
+ }
289
+ gl.bindBuffer(gl.ARRAY_BUFFER, vbo);
290
+ gl.bufferData(gl.ARRAY_BUFFER, data, gl.STATIC_DRAW);
291
+ const aPos = gl.getAttribLocation(program, "aPos");
292
+ const aUv = gl.getAttribLocation(program, "aUv");
293
+ gl.enableVertexAttribArray(aPos);
294
+ gl.vertexAttribPointer(aPos, 2, gl.FLOAT, false, 16, 0);
295
+ gl.enableVertexAttribArray(aUv);
296
+ gl.vertexAttribPointer(aUv, 2, gl.FLOAT, false, 16, 8);
297
+ gl.bindVertexArray(null);
298
+ const texture = gl.createTexture();
299
+ if (!texture) {
300
+ throw new Error("Failed to create WebGL texture");
301
+ }
302
+ gl.bindTexture(gl.TEXTURE_2D, texture);
303
+ gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
304
+ gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
305
+ gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
306
+ gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
307
+ gl.bindTexture(gl.TEXTURE_2D, null);
308
+ return {
309
+ gl,
310
+ program,
311
+ vao,
312
+ vbo,
313
+ texture,
314
+ uSource: gl.getUniformLocation(program, "uSource"),
315
+ uResolution: gl.getUniformLocation(program, "uResolution"),
316
+ uDensity: gl.getUniformLocation(program, "uDensity"),
317
+ uSize: gl.getUniformLocation(program, "uSize"),
318
+ uRandomness: gl.getUniformLocation(program, "uRandomness")
319
+ };
320
+ },
321
+ apply: ({ source, width, height, params, state, flipSourceY }) => {
322
+ const r = resolve(params);
323
+ const { gl, program, vao, texture } = state;
324
+ gl.viewport(0, 0, width, height);
325
+ gl.bindFramebuffer(gl.FRAMEBUFFER, null);
326
+ gl.clearColor(0, 0, 0, 0);
327
+ gl.clear(gl.COLOR_BUFFER_BIT);
328
+ gl.useProgram(program);
329
+ gl.bindVertexArray(vao);
330
+ gl.activeTexture(gl.TEXTURE0);
331
+ gl.bindTexture(gl.TEXTURE_2D, texture);
332
+ gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, flipSourceY);
333
+ gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, source);
334
+ if (state.uSource)
335
+ gl.uniform1i(state.uSource, 0);
336
+ if (state.uResolution)
337
+ gl.uniform2f(state.uResolution, width, height);
338
+ if (state.uDensity)
339
+ gl.uniform1f(state.uDensity, r.density);
340
+ if (state.uSize)
341
+ gl.uniform1f(state.uSize, r.size);
342
+ if (state.uRandomness)
343
+ gl.uniform1f(state.uRandomness, r.randomness);
344
+ gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
345
+ gl.bindVertexArray(null);
346
+ gl.bindTexture(gl.TEXTURE_2D, null);
347
+ gl.useProgram(null);
348
+ },
349
+ cleanup: ({ gl, program, vao, vbo, texture }) => {
350
+ gl.deleteBuffer(vbo);
351
+ gl.deleteProgram(program);
352
+ gl.deleteVertexArray(vao);
353
+ gl.deleteTexture(texture);
354
+ },
355
+ schema: speckleSchema,
356
+ validateParams: validateSpeckleParams
357
+ });
358
+ export {
359
+ speckle
360
+ };
@@ -0,0 +1 @@
1
+ export declare const buildGaussianBlurFs: (direction: "horizontal" | "vertical") => string;