@firecms/neat 0.5.1 → 0.7.0

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.
package/dist/index.es.js CHANGED
@@ -1,574 +1,4 @@
1
- import * as l from "three";
2
- const U = 50, D = 80, be = !0, j = 6, ze = new l.Clock(), Q = Te();
3
- class Be {
4
- _ref;
5
- _speed = -1;
6
- _horizontalPressure = -1;
7
- _verticalPressure = -1;
8
- _waveFrequencyX = -1;
9
- _waveFrequencyY = -1;
10
- _waveAmplitude = -1;
11
- _shadows = -1;
12
- _highlights = -1;
13
- _saturation = -1;
14
- _brightness = -1;
15
- _grainScale = -1;
16
- _grainIntensity = -1;
17
- _grainSparsity = -1;
18
- _grainSpeed = -1;
19
- _colorBlending = -1;
20
- _colors = [];
21
- _wireframe = !1;
22
- _backgroundColor = "#FFFFFF";
23
- _backgroundAlpha = 1;
24
- _flowDistortionA = 0;
25
- _flowDistortionB = 0;
26
- _flowScale = 1;
27
- _flowEase = 0;
28
- _flowEnabled = !0;
29
- _mouseDistortionStrength = 0;
30
- _mouseDistortionRadius = 0.25;
31
- _mouseDecayRate = 0.96;
32
- _mouseDarken = 0;
33
- _mouse = new l.Vector2(-1e3, -1e3);
34
- _mouseFBO = null;
35
- _sceneMouse = null;
36
- _cameraMouse = null;
37
- _mouseObjects = [];
38
- _currentBrush = 0;
39
- _mouseBrushBaseScale = 1;
40
- _enableProceduralTexture = !1;
41
- _textureVoidLikelihood = 0.45;
42
- _textureVoidWidthMin = 200;
43
- _textureVoidWidthMax = 486;
44
- _textureBandDensity = 2.15;
45
- _textureColorBlending = 0.01;
46
- _textureSeed = 333;
47
- _textureEase = 0.5;
48
- _proceduralTexture = null;
49
- _proceduralBackgroundColor = "#000000";
50
- _textureShapeTriangles = 20;
51
- _textureShapeCircles = 15;
52
- _textureShapeBars = 15;
53
- _textureShapeSquiggles = 10;
54
- requestRef = -1;
55
- sizeObserver;
56
- sceneState;
57
- _cachedUniforms = null;
58
- _linkElement = null;
59
- _yOffset = 0;
60
- _yOffsetWaveMultiplier = 4e-3;
61
- _yOffsetColorMultiplier = 4e-3;
62
- _yOffsetFlowMultiplier = 4e-3;
63
- _tempClearColor = new l.Color();
64
- _resizeTimeoutId = null;
65
- _textureNeedsUpdate = !1;
66
- _lastColorUpdate = 0;
67
- _linkCheckCounter = 0;
68
- _mouseUpdateScheduled = !1;
69
- _pendingMousePosition = null;
70
- _colorsChanged = !0;
71
- constructor(e) {
72
- const {
73
- ref: s,
74
- speed: t = 4,
75
- horizontalPressure: f = 3,
76
- verticalPressure: c = 3,
77
- waveFrequencyX: o = 5,
78
- waveFrequencyY: p = 5,
79
- waveAmplitude: g = 3,
80
- colors: d,
81
- highlights: v = 4,
82
- shadows: u = 4,
83
- colorSaturation: x = 0,
84
- colorBrightness: O = 1,
85
- colorBlending: M = 5,
86
- grainScale: z = 2,
87
- grainIntensity: y = 0.55,
88
- grainSparsity: F = 0,
89
- grainSpeed: C = 0.1,
90
- wireframe: a = !1,
91
- backgroundColor: n = "#FFFFFF",
92
- backgroundAlpha: h = 1,
93
- resolution: _ = 1,
94
- seed: S,
95
- yOffset: B = 0,
96
- yOffsetWaveMultiplier: N = 4,
97
- yOffsetColorMultiplier: V = 4,
98
- yOffsetFlowMultiplier: $ = 4,
99
- flowDistortionA: ee = 0,
100
- flowDistortionB: te = 0,
101
- flowScale: oe = 1,
102
- flowEase: se = 0,
103
- flowEnabled: ie = !0,
104
- mouseDistortionStrength: re = 0,
105
- mouseDistortionRadius: ae = 0.25,
106
- mouseDecayRate: le = 0.96,
107
- mouseDarken: ne = 0,
108
- enableProceduralTexture: ue = !1,
109
- textureVoidLikelihood: ce = 0.45,
110
- textureVoidWidthMin: _e = 200,
111
- textureVoidWidthMax: he = 486,
112
- textureBandDensity: fe = 2.15,
113
- textureColorBlending: de = 0.01,
114
- textureSeed: pe = 333,
115
- textureEase: ve = 0.5,
116
- proceduralBackgroundColor: xe = "#000000",
117
- textureShapeTriangles: ge = 20,
118
- textureShapeCircles: me = 15,
119
- textureShapeBars: ye = 15,
120
- textureShapeSquiggles: we = 10
121
- } = e;
122
- this._ref = s, this.destroy = this.destroy.bind(this), this._initScene = this._initScene.bind(this), this._buildMaterial = this._buildMaterial.bind(this), this.speed = t, this.horizontalPressure = f, this.verticalPressure = c, this.waveFrequencyX = o, this.waveFrequencyY = p, this.waveAmplitude = g, this.colorBlending = M, this.grainScale = z, this.grainIntensity = y, this.grainSparsity = F, this.grainSpeed = C, this.colors = d, this.shadows = u, this.highlights = v, this.colorSaturation = x, this.colorBrightness = O, this.wireframe = a, this.backgroundColor = n, this.backgroundAlpha = h, this.yOffset = B, this.yOffsetWaveMultiplier = N, this.yOffsetColorMultiplier = V, this.yOffsetFlowMultiplier = $, this.flowDistortionA = ee, this.flowDistortionB = te, this.flowScale = oe, this.flowEase = se, this.flowEnabled = ie, this.mouseDistortionStrength = re, this.mouseDistortionRadius = ae, this.mouseDecayRate = le, this.mouseDarken = ne, this.enableProceduralTexture = ue, this.textureVoidLikelihood = ce, this.textureVoidWidthMin = _e, this.textureVoidWidthMax = he, this.textureBandDensity = fe, this.textureColorBlending = de, this.textureSeed = pe, this.textureEase = ve, this._proceduralBackgroundColor = xe, this._textureShapeTriangles = ge, this._textureShapeCircles = me, this._textureShapeBars = ye, this._textureShapeSquiggles = we, this._setupMouseInteraction(), this.sceneState = this._initScene(_);
123
- let G = S !== void 0 ? S : Oe();
124
- const X = () => {
125
- const { renderer: w, camera: E, scene: T } = this.sceneState;
126
- if (this._linkCheckCounter++, this._linkCheckCounter >= 300 && (this._linkCheckCounter = 0, (!this._linkElement || !document.contains(this._linkElement)) && (this._linkElement = Pe(s))), this._cachedUniforms) {
127
- const i = this._cachedUniforms;
128
- G += ze.getDelta() * this._speed, i.u_time.value = G, i.u_resolution.value.set(this._ref.width, this._ref.height), i.u_color_pressure.value.set(this._horizontalPressure, this._verticalPressure), i.u_wave_frequency_x.value = this._waveFrequencyX, i.u_wave_frequency_y.value = this._waveFrequencyY, i.u_wave_amplitude.value = this._waveAmplitude, i.u_color_blending.value = this._colorBlending, i.u_shadows.value = this._shadows, i.u_highlights.value = this._highlights, i.u_saturation.value = this._saturation, i.u_brightness.value = this._brightness, i.u_grain_intensity.value = this._grainIntensity, i.u_grain_sparsity.value = this._grainSparsity, i.u_grain_speed.value = this._grainSpeed, i.u_grain_scale.value = this._grainScale, i.u_y_offset.value = this._yOffset, i.u_y_offset_wave_multiplier.value = this._yOffsetWaveMultiplier, i.u_y_offset_color_multiplier.value = this._yOffsetColorMultiplier, i.u_y_offset_flow_multiplier.value = this._yOffsetFlowMultiplier, i.u_flow_distortion_a.value = this._flowDistortionA, i.u_flow_distortion_b.value = this._flowDistortionB, i.u_flow_scale.value = this._flowScale, i.u_flow_ease.value = this._flowEase, i.u_flow_enabled.value = this._flowEnabled ? 1 : 0, i.u_mouse_distortion_strength.value = this._mouseDistortionStrength, i.u_mouse_distortion_radius.value = this._mouseDistortionRadius, i.u_mouse_darken.value = this._mouseDarken, i.u_enable_procedural_texture.value = this._enableProceduralTexture ? 1 : 0, this._textureNeedsUpdate && this._enableProceduralTexture && (this._proceduralTexture && this._proceduralTexture.dispose(), this._proceduralTexture = this._createProceduralTexture(), this._textureNeedsUpdate = !1), i.u_procedural_texture.value = this._proceduralTexture, i.u_texture_ease.value = this._textureEase, this.sceneState.meshes[0].material.wireframe = this._wireframe;
129
- const m = Date.now();
130
- if (this._colorsChanged || m - this._lastColorUpdate > 100) {
131
- this._lastColorUpdate = m, this._colorsChanged = !1;
132
- const q = i.u_colors.value;
133
- for (let P = 0; P < j; P++)
134
- if (P < this._colors.length) {
135
- const L = this._colors[P];
136
- q[P].is_active = L.enabled ? 1 : 0, q[P].color.setStyle(L.color, ""), q[P].influence = L.influence || 0;
137
- } else
138
- q[P].is_active = 0;
139
- i.u_colors_count.value = j;
140
- }
141
- }
142
- if (this._mouseFBO && this._sceneMouse && this._cameraMouse && this._mouseDistortionStrength > 0) {
143
- let i = !1;
144
- for (let m = 0; m < this._mouseObjects.length; m++) {
145
- const b = this._mouseObjects[m];
146
- b.mesh.visible && (i = !0, b.mesh.rotation.z += 0.01, b.mesh.material instanceof l.MeshBasicMaterial && (b.mesh.material.opacity *= this._mouseDecayRate, b.mesh.material.opacity < 0.01 && (b.mesh.visible = !1)));
147
- }
148
- if (i) {
149
- w.getClearColor(this._tempClearColor);
150
- const m = w.getClearAlpha();
151
- w.setClearColor(0, 0), w.setRenderTarget(this._mouseFBO), w.clear(), w.render(this._sceneMouse, this._cameraMouse), w.setRenderTarget(null), w.setClearColor(this._tempClearColor, m), this._cachedUniforms && (this._cachedUniforms.u_mouse_texture.value = this._mouseFBO.texture);
152
- }
153
- }
154
- w.setClearColor(this._backgroundColor, this._backgroundAlpha), w.render(T, E), this.requestRef = requestAnimationFrame(X);
155
- }, Se = () => {
156
- const { renderer: w } = this.sceneState, E = w.domElement, T = E.clientWidth, i = E.clientHeight;
157
- if (this.sceneState.renderer.setSize(T, i, !1), K(this.sceneState.camera, T, i), this._mouseFBO && this._cameraMouse) {
158
- const m = i / 2, b = T / i;
159
- this._mouseFBO.setSize(T / 2, i / 2), this._cameraMouse.left = -m * b, this._cameraMouse.right = m * b, this._cameraMouse.top = m, this._cameraMouse.bottom = -m, this._cameraMouse.updateProjectionMatrix();
160
- }
161
- };
162
- this.sizeObserver = new ResizeObserver(() => {
163
- this._resizeTimeoutId !== null && clearTimeout(this._resizeTimeoutId), this._resizeTimeoutId = window.setTimeout(() => {
164
- Se(), this._resizeTimeoutId = null;
165
- }, 100);
166
- }), this.sizeObserver.observe(s), X();
167
- }
168
- destroy() {
169
- this && (cancelAnimationFrame(this.requestRef), this.sizeObserver.disconnect(), this._resizeTimeoutId !== null && (clearTimeout(this._resizeTimeoutId), this._resizeTimeoutId = null), this.sceneState && (this.sceneState.renderer.dispose(), this.sceneState.meshes.forEach((e) => {
170
- e.geometry.dispose(), Array.isArray(e.material) ? e.material.forEach((s) => s.dispose()) : e.material.dispose();
171
- })), this._mouseFBO && this._mouseFBO.dispose(), this._proceduralTexture && this._proceduralTexture.dispose());
172
- }
173
- downloadAsPNG(e = "neat.png") {
174
- console.log("Downloading as PNG", this._ref);
175
- const s = this._ref.toDataURL("image/png");
176
- console.log("data", s), Fe(s, e);
177
- }
178
- set speed(e) {
179
- this._speed = e / 20;
180
- }
181
- set horizontalPressure(e) {
182
- this._horizontalPressure = e / 4;
183
- }
184
- set verticalPressure(e) {
185
- this._verticalPressure = e / 4;
186
- }
187
- set waveFrequencyX(e) {
188
- this._waveFrequencyX = e * 0.04;
189
- }
190
- set waveFrequencyY(e) {
191
- this._waveFrequencyY = e * 0.04;
192
- }
193
- set waveAmplitude(e) {
194
- this._waveAmplitude = e * 0.75;
195
- }
196
- set colors(e) {
197
- this._colors = e, this._colorsChanged = !0;
198
- }
199
- set highlights(e) {
200
- this._highlights = e / 100;
201
- }
202
- set shadows(e) {
203
- this._shadows = e / 100;
204
- }
205
- set colorSaturation(e) {
206
- this._saturation = e / 10;
207
- }
208
- set colorBrightness(e) {
209
- this._brightness = e;
210
- }
211
- set colorBlending(e) {
212
- this._colorBlending = e / 10;
213
- }
214
- set grainScale(e) {
215
- this._grainScale = e == 0 ? 1 : e;
216
- }
217
- set grainIntensity(e) {
218
- this._grainIntensity = e;
219
- }
220
- set grainSparsity(e) {
221
- this._grainSparsity = e;
222
- }
223
- set grainSpeed(e) {
224
- this._grainSpeed = e;
225
- }
226
- set wireframe(e) {
227
- this._wireframe = e;
228
- }
229
- set resolution(e) {
230
- this.sceneState = this._initScene(e);
231
- }
232
- set backgroundColor(e) {
233
- this._backgroundColor = e;
234
- }
235
- set backgroundAlpha(e) {
236
- this._backgroundAlpha = e;
237
- }
238
- set yOffset(e) {
239
- this._yOffset = e;
240
- }
241
- get yOffsetWaveMultiplier() {
242
- return this._yOffsetWaveMultiplier * 1e3;
243
- }
244
- set yOffsetWaveMultiplier(e) {
245
- this._yOffsetWaveMultiplier = e / 1e3;
246
- }
247
- get yOffsetColorMultiplier() {
248
- return this._yOffsetColorMultiplier * 1e3;
249
- }
250
- set yOffsetColorMultiplier(e) {
251
- this._yOffsetColorMultiplier = e / 1e3;
252
- }
253
- get yOffsetFlowMultiplier() {
254
- return this._yOffsetFlowMultiplier * 1e3;
255
- }
256
- set yOffsetFlowMultiplier(e) {
257
- this._yOffsetFlowMultiplier = e / 1e3;
258
- }
259
- set flowDistortionA(e) {
260
- this._flowDistortionA = e;
261
- }
262
- set flowDistortionB(e) {
263
- this._flowDistortionB = e;
264
- }
265
- set flowScale(e) {
266
- this._flowScale = e;
267
- }
268
- set flowEase(e) {
269
- this._flowEase = e;
270
- }
271
- set flowEnabled(e) {
272
- this._flowEnabled = e;
273
- }
274
- get flowEnabled() {
275
- return this._flowEnabled;
276
- }
277
- set mouseDistortionStrength(e) {
278
- this._mouseDistortionStrength = Math.max(0, e);
279
- }
280
- set mouseDistortionRadius(e) {
281
- this._mouseDistortionRadius = Math.max(0.01, Math.min(e, 1)), this._updateBrushScale();
282
- }
283
- _updateBrushScale() {
284
- !this._mouseObjects || this._mouseObjects.length === 0 || (this._mouseBrushBaseScale = this._mouseDistortionRadius);
285
- }
286
- set mouseDecayRate(e) {
287
- this._mouseDecayRate = Math.max(0.9, Math.min(e, 0.99));
288
- }
289
- set mouseDarken(e) {
290
- this._mouseDarken = e;
291
- }
292
- set enableProceduralTexture(e) {
293
- this._enableProceduralTexture = e, e && !this._proceduralTexture && (this._textureNeedsUpdate = !0);
294
- }
295
- set textureVoidLikelihood(e) {
296
- this._textureVoidLikelihood = e, this._enableProceduralTexture && (this._textureNeedsUpdate = !0);
297
- }
298
- set textureVoidWidthMin(e) {
299
- this._textureVoidWidthMin = e, this._enableProceduralTexture && (this._textureNeedsUpdate = !0);
300
- }
301
- set textureVoidWidthMax(e) {
302
- this._textureVoidWidthMax = e, this._enableProceduralTexture && (this._textureNeedsUpdate = !0);
303
- }
304
- set textureBandDensity(e) {
305
- this._textureBandDensity = e, this._enableProceduralTexture && (this._textureNeedsUpdate = !0);
306
- }
307
- set textureColorBlending(e) {
308
- this._textureColorBlending = e, this._enableProceduralTexture && (this._textureNeedsUpdate = !0);
309
- }
310
- set textureSeed(e) {
311
- this._textureSeed = e, this._enableProceduralTexture && (this._textureNeedsUpdate = !0);
312
- }
313
- get textureEase() {
314
- return this._textureEase;
315
- }
316
- set textureEase(e) {
317
- this._textureEase = e;
318
- }
319
- set proceduralBackgroundColor(e) {
320
- this._proceduralBackgroundColor = e, this._enableProceduralTexture && (this._textureNeedsUpdate = !0);
321
- }
322
- set textureShapeTriangles(e) {
323
- this._textureShapeTriangles = e, this._enableProceduralTexture && (this._textureNeedsUpdate = !0);
324
- }
325
- set textureShapeCircles(e) {
326
- this._textureShapeCircles = e, this._enableProceduralTexture && (this._textureNeedsUpdate = !0);
327
- }
328
- set textureShapeBars(e) {
329
- this._textureShapeBars = e, this._enableProceduralTexture && (this._textureNeedsUpdate = !0);
330
- }
331
- set textureShapeSquiggles(e) {
332
- this._textureShapeSquiggles = e, this._enableProceduralTexture && (this._textureNeedsUpdate = !0);
333
- }
334
- _initScene(e) {
335
- const s = this._ref.width, t = this._ref.height;
336
- this.sceneState && this.sceneState.renderer && (this.sceneState.renderer.dispose(), this.sceneState.meshes.forEach((u) => {
337
- u.geometry.dispose(), Array.isArray(u.material) ? u.material.forEach((x) => x.dispose()) : u.material.dispose();
338
- }));
339
- const f = new l.WebGLRenderer({
340
- alpha: !0,
341
- preserveDrawingBuffer: !0,
342
- canvas: this._ref
343
- });
344
- f.setClearColor(16711680, 0.5), f.setSize(s, t, !1);
345
- const c = [], o = new l.Scene(), p = this._buildMaterial(s, t), g = new l.PlaneGeometry(U, D, 240 * e, 240 * e), d = new l.Mesh(g, p);
346
- d.rotation.x = -Math.PI / 3.5, d.position.z = -1, c.push(d), o.add(d);
347
- const v = new l.OrthographicCamera(0, 0, 0, 0, 0, 0);
348
- return v.position.z = 5, K(v, s, t), {
349
- renderer: f,
350
- camera: v,
351
- scene: o,
352
- meshes: c,
353
- resolution: e
354
- };
355
- }
356
- _buildMaterial(e, s) {
357
- const t = Array.from({ length: j }).map((o, p) => ({
358
- is_active: p < this._colors.length && this._colors[p].enabled ? 1 : 0,
359
- color: new l.Color(p < this._colors.length ? this._colors[p].color : 0),
360
- influence: p < this._colors.length && this._colors[p].influence || 0
361
- })), f = {
362
- u_time: { value: 0 },
363
- u_color_pressure: { value: new l.Vector2(this._horizontalPressure, this._verticalPressure) },
364
- u_wave_frequency_x: { value: this._waveFrequencyX },
365
- u_wave_frequency_y: { value: this._waveFrequencyY },
366
- u_wave_amplitude: { value: this._waveAmplitude },
367
- u_resolution: { value: new l.Vector2(e, s) },
368
- u_colors: { value: t },
369
- u_colors_count: { value: this._colors.length },
370
- u_plane_width: { value: U },
371
- u_plane_height: { value: D },
372
- u_shadows: { value: this._shadows },
373
- u_highlights: { value: this._highlights },
374
- u_grain_intensity: { value: this._grainIntensity },
375
- u_grain_sparsity: { value: this._grainSparsity },
376
- u_grain_scale: { value: this._grainScale },
377
- u_grain_speed: { value: this._grainSpeed },
378
- u_flow_distortion_a: { value: this._flowDistortionA },
379
- u_flow_distortion_b: { value: this._flowDistortionB },
380
- u_flow_scale: { value: this._flowScale },
381
- u_flow_ease: { value: this._flowEase },
382
- u_flow_enabled: { value: this._flowEnabled ? 1 : 0 },
383
- u_y_offset: { value: this._yOffset },
384
- u_y_offset_wave_multiplier: { value: this._yOffsetWaveMultiplier },
385
- u_y_offset_color_multiplier: { value: this._yOffsetColorMultiplier },
386
- u_y_offset_flow_multiplier: { value: this._yOffsetFlowMultiplier },
387
- u_mouse_distortion_strength: { value: this._mouseDistortionStrength },
388
- u_mouse_distortion_radius: { value: this._mouseDistortionRadius },
389
- u_mouse_darken: { value: this._mouseDarken },
390
- u_mouse_texture: { value: this._mouseFBO ? this._mouseFBO.texture : null },
391
- u_procedural_texture: { value: this._proceduralTexture },
392
- u_enable_procedural_texture: { value: this._enableProceduralTexture ? 1 : 0 },
393
- u_texture_ease: { value: this._textureEase },
394
- u_saturation: { value: this._saturation },
395
- u_brightness: { value: this._brightness },
396
- u_color_blending: { value: this._colorBlending }
397
- }, c = new l.ShaderMaterial({
398
- uniforms: f,
399
- vertexShader: H() + Y() + Z() + Ce(),
400
- fragmentShader: H() + Z() + Y() + Me()
401
- });
402
- return this._cachedUniforms = f, c.wireframe = be, c;
403
- }
404
- _setupMouseInteraction() {
405
- if (!this._ref)
406
- return;
407
- const e = this._ref.width, s = this._ref.height;
408
- this._mouseFBO = new l.WebGLRenderTarget(e / 2, s / 2), this._sceneMouse = new l.Scene();
409
- const t = s / 2, f = e / s;
410
- this._cameraMouse = new l.OrthographicCamera(
411
- -t * f,
412
- t * f,
413
- t,
414
- -t,
415
- 0,
416
- 1e4
417
- ), this._cameraMouse.position.set(0, 0, 100);
418
- const c = document.createElement("canvas");
419
- c.width = 128, c.height = 128;
420
- const o = c.getContext("2d");
421
- if (o) {
422
- const u = o.createRadialGradient(64, 64, 0, 64, 64, 64);
423
- u.addColorStop(0, "rgba(255,255,255,0.8)"), u.addColorStop(0.5, "rgba(255,255,255,0.4)"), u.addColorStop(1, "rgba(255,255,255,0)"), o.fillStyle = u, o.fillRect(0, 0, 128, 128);
424
- }
425
- const p = new l.CanvasTexture(c), g = new l.MeshBasicMaterial({
426
- map: p,
427
- transparent: !0,
428
- opacity: 1,
429
- depthTest: !1,
430
- blending: l.AdditiveBlending
431
- }), d = new l.PlaneGeometry(200, 200), v = 50;
432
- for (let u = 0; u < v; u++) {
433
- const x = new l.Mesh(d, g.clone());
434
- x.visible = !1, this._sceneMouse.add(x), this._mouseObjects.push({ mesh: x, active: !1 });
435
- }
436
- this._updateBrushScale(), this._ref.addEventListener("mousemove", this._onMouseMove.bind(this));
437
- }
438
- _onMouseMove(e) {
439
- if (!this._ref || !this._sceneMouse)
440
- return;
441
- const s = this._ref.getBoundingClientRect(), t = this._ref.width, f = this._ref.height;
442
- this._pendingMousePosition = {
443
- x: e.clientX - s.left - t / 2,
444
- y: -(e.clientY - s.top - f / 2)
445
- }, this._mouseUpdateScheduled || (this._mouseUpdateScheduled = !0, requestAnimationFrame(() => {
446
- if (this._mouseUpdateScheduled = !1, !this._pendingMousePosition)
447
- return;
448
- this._mouse.x = this._pendingMousePosition.x, this._mouse.y = this._pendingMousePosition.y;
449
- const c = this._mouseObjects[this._currentBrush];
450
- c.mesh.scale.set(this._mouseBrushBaseScale, this._mouseBrushBaseScale, 1), c.active = !0, c.mesh.visible = !0, c.mesh.position.set(this._mouse.x, this._mouse.y, 0), c.mesh.rotation.z = Math.random() * Math.PI * 2, c.mesh.material instanceof l.MeshBasicMaterial && (c.mesh.material.opacity = 1), this._currentBrush = (this._currentBrush + 1) % this._mouseObjects.length, this._pendingMousePosition = null;
451
- }));
452
- }
453
- _createProceduralTexture() {
454
- const s = document.createElement("canvas");
455
- s.width = 1024, s.height = 1024;
456
- const t = s.getContext("2d", { willReadFrequently: !0 });
457
- if (!t)
458
- return new l.Texture();
459
- let f = this._textureSeed;
460
- const c = this._textureSeed;
461
- function o() {
462
- const a = Math.sin(f++) * 1e4;
463
- return a - Math.floor(a);
464
- }
465
- const p = (a) => {
466
- f = c + a;
467
- }, g = this._colors.filter((a) => a.enabled).map((a) => a.color);
468
- if (g.length === 0)
469
- return new l.Texture();
470
- function d(a) {
471
- const n = parseInt(a.replace("#", ""), 16);
472
- return {
473
- r: n >> 16 & 255,
474
- g: n >> 8 & 255,
475
- b: n & 255
476
- };
477
- }
478
- function v(a, n, h) {
479
- return "#" + ((1 << 24) + (Math.round(a) << 16) + (Math.round(n) << 8) + Math.round(h)).toString(16).slice(1);
480
- }
481
- const u = () => {
482
- const a = g[Math.floor(o() * g.length)], n = g[Math.floor(o() * g.length)], h = o() * this._textureColorBlending, _ = d(a), S = d(n), B = _.r + (S.r - _.r) * h, N = _.g + (S.g - _.g) * h, V = _.b + (S.b - _.b) * h;
483
- return v(B, N, V);
484
- }, x = this._proceduralBackgroundColor || "#000000";
485
- t.fillStyle = x, t.fillRect(0, 0, 1024, 1024);
486
- const O = t.createLinearGradient(0, 0, 0, 1024);
487
- O.addColorStop(0, u()), O.addColorStop(1, u()), t.fillStyle = O, t.fillRect(0, 0, 1024, 1024);
488
- for (let a = 0; a < this._textureShapeTriangles; a++) {
489
- t.fillStyle = u(), t.beginPath();
490
- const n = o() * 1024, h = o() * 1024, _ = 100 + o() * 300;
491
- t.moveTo(n, h), t.lineTo(n + (o() - 0.5) * _, h + (o() - 0.5) * _), t.lineTo(n + (o() - 0.5) * _, h + (o() - 0.5) * _), t.fill();
492
- }
493
- for (let a = 0; a < this._textureShapeCircles; a++) {
494
- t.strokeStyle = u(), t.lineWidth = 10 + o() * 50, t.beginPath();
495
- const n = o() * 1024, h = o() * 1024, _ = 50 + o() * 150;
496
- t.arc(n, h, _, 0, Math.PI * 2), t.stroke();
497
- }
498
- for (let a = 0; a < this._textureShapeBars; a++)
499
- t.fillStyle = u(), t.save(), t.translate(o() * 1024, o() * 1024), t.rotate(o() * Math.PI), t.fillRect(-150, -25, 300, 50), t.restore();
500
- t.lineWidth = 15, t.lineCap = "round";
501
- for (let a = 0; a < this._textureShapeSquiggles; a++) {
502
- t.strokeStyle = u(), t.beginPath();
503
- let n = o() * 1024, h = o() * 1024;
504
- t.moveTo(n, h);
505
- for (let _ = 0; _ < 4; _++)
506
- t.bezierCurveTo(
507
- n + (o() - 0.5) * 300,
508
- h + (o() - 0.5) * 300,
509
- n + (o() - 0.5) * 300,
510
- h + (o() - 0.5) * 300,
511
- n + (o() - 0.5) * 300,
512
- h + (o() - 0.5) * 300
513
- ), n += (o() - 0.5) * 300, h += (o() - 0.5) * 300;
514
- t.stroke();
515
- }
516
- p(5e4);
517
- const M = document.createElement("canvas");
518
- M.width = 1024, M.height = 1024;
519
- const z = M.getContext("2d", { willReadFrequently: !0 });
520
- if (!z)
521
- return new l.Texture();
522
- z.fillStyle = x, z.fillRect(0, 0, 1024, 1024);
523
- let y = 0;
524
- const F = [];
525
- for (; y < 1024; )
526
- if (o() < this._textureVoidLikelihood) {
527
- const n = this._textureVoidWidthMin + o() * (this._textureVoidWidthMax - this._textureVoidWidthMin);
528
- F.push({ type: "void", x: y, width: n }), y += n;
529
- } else {
530
- const n = 50 + o() * 200;
531
- F.push({ type: "matter", x: y, width: n }), y += n;
532
- }
533
- for (const a of F)
534
- if (a.type === "matter") {
535
- const n = a.x, h = Math.min(a.x + a.width, 1024);
536
- let _ = n;
537
- for (; _ < h; ) {
538
- const S = (2 + o() * 20) / this._textureBandDensity, B = Math.floor(o() * 1024);
539
- z.drawImage(
540
- s,
541
- B,
542
- 0,
543
- S,
544
- 1024,
545
- _,
546
- 0,
547
- S,
548
- 1024
549
- ), _ += S;
550
- }
551
- }
552
- const C = new l.CanvasTexture(M);
553
- return C.minFilter = l.LinearMipmapLinearFilter, C.magFilter = l.LinearFilter, C.wrapS = l.RepeatWrapping, C.wrapT = l.RepeatWrapping, C.anisotropy = 16, C.needsUpdate = !0, C;
554
- }
555
- }
556
- function K(r, e, s) {
557
- const c = e * s / 1e6 * U * D / 1.5, o = e / s, p = Math.sqrt(c * o), g = c / p;
558
- let d = -U / 2, v = Math.min((d + p) / 1.5, U / 2), u = D / 4, x = Math.max((u - g) / 2, -D / 4);
559
- if (o < 1) {
560
- const z = o;
561
- d = d * z, v = v * z;
562
- const y = 1.05;
563
- d = d * y, v = v * y, u = u * y, x = x * y;
564
- }
565
- const O = -100, M = 1e3;
566
- r instanceof l.OrthographicCamera ? (r.left = d, r.right = v, r.top = u, r.bottom = x, r.near = O, r.far = M, r.updateProjectionMatrix()) : r instanceof l.PerspectiveCamera && (r.aspect = e / s, r.updateProjectionMatrix());
567
- }
568
- let R = null, A = null;
569
- function Ce() {
570
- return R || (R = `
571
- void main() {
1
+ const he = `void main() {
572
2
  vUv = uv;
573
3
 
574
4
  // SCROLLING LOGIC
@@ -604,13 +34,14 @@ void main() {
604
34
  }
605
35
  }
606
36
 
607
- // Pass the standard flow UV to fragment shader (for mouse/texture)
37
+ // Pass the standard flow UV to fragment shader (for texture)
608
38
  vFlowUv = flowUv;
609
39
 
610
40
  // 3. COLOR MIXING
611
41
  // We take the computed flow UVs and apply the color offset
612
42
  // Scale by plane height to match wave offset speed (world space vs UV space)
613
43
  vec3 color = u_colors[0].color;
44
+ // ...
614
45
  vec2 adjustedUv = flowUv;
615
46
  adjustedUv.y += colorOffset / u_plane_height; // Scroll the color mixing pattern
616
47
 
@@ -618,22 +49,24 @@ void main() {
618
49
  const float minNoise = .0;
619
50
  const float maxNoise = .9;
620
51
 
621
- for (int i = 1; i < u_colors_count; i++) {
622
- if(u_colors[i].is_active > 0.5){
623
- float noiseFlow = (1. + float(i)) / 30.;
624
- float noiseSpeed = (1. + float(i)) * 0.11;
625
- float noiseSeed = 13. + float(i) * 7.;
626
-
627
- float noise = snoise(
628
- vec3(
629
- noise_cord.x * u_color_pressure.x + u_time * noiseFlow * 2.,
630
- noise_cord.y * u_color_pressure.y,
631
- u_time * noiseSpeed
632
- ) + noiseSeed
633
- ) - (.1 * float(i)) + (.5 * u_color_blending);
634
-
635
- noise = clamp(minNoise, maxNoise + float(i) * 0.02, noise);
636
- color = mix(color, u_colors[i].color, smoothstep(0.0, u_color_blending, noise));
52
+ for (int i = 1; i < 6; i++) {
53
+ if (i < u_colors_count) {
54
+ if (u_colors[i].is_active > 0.5) {
55
+ float noiseFlow = (1. + float(i)) / 30.;
56
+ float noiseSpeed = (1. + float(i)) * 0.11;
57
+ float noiseSeed = 13. + float(i) * 7.;
58
+
59
+ float noise = snoise(
60
+ vec3(
61
+ noise_cord.x * u_color_pressure.x + u_time * noiseFlow * 2.,
62
+ noise_cord.y * u_color_pressure.y,
63
+ u_time * noiseSpeed
64
+ ) + noiseSeed
65
+ ) - (.1 * float(i)) + (.5 * u_color_blending);
66
+
67
+ noise = clamp(noise, minNoise, maxNoise + float(i) * 0.02);
68
+ color = mix(color, u_colors[i].color, smoothstep(0.0, u_color_blending, noise));
69
+ }
637
70
  }
638
71
  }
639
72
 
@@ -644,11 +77,7 @@ void main() {
644
77
  gl_Position = projectionMatrix * modelViewMatrix * vec4(newPosition, 1.0);
645
78
  v_new_position = gl_Position;
646
79
  }
647
- `, R);
648
- }
649
- function Me() {
650
- return A || (A = `
651
- float random(vec2 p) {
80
+ `, de = `float random(vec2 p) {
652
81
  return fract(sin(dot(p, vec2(12.9898,78.233))) * 43758.5453);
653
82
  }
654
83
 
@@ -665,20 +94,8 @@ float fbm(vec3 x) {
665
94
  }
666
95
 
667
96
  void main() {
668
- // MOUSE DISTORTION
669
97
  vec2 finalUv = vFlowUv;
670
98
 
671
- if (u_mouse_distortion_strength > 0.0) {
672
- vec4 mouseColor = texture2D(u_mouse_texture, vUv);
673
- float mouseValue = mouseColor.r;
674
-
675
- if (mouseValue > 0.001) {
676
- float distortionAmount = mouseValue * u_mouse_distortion_strength;
677
- vec2 mouseDisp = vec2(distortionAmount, distortionAmount);
678
- finalUv -= mouseDisp;
679
- }
680
- }
681
-
682
99
  vec3 baseColor;
683
100
 
684
101
  if (u_enable_procedural_texture > 0.5) {
@@ -711,61 +128,69 @@ void main() {
711
128
  vec3 color = baseColor;
712
129
 
713
130
  // Post-processing
714
- color += pow(v_displacement_amount, 1.0) * u_highlights;
715
- color -= pow(1.0 - v_displacement_amount, 2.0) * u_shadows;
131
+ color += v_displacement_amount * u_highlights;
132
+ // Replace pow() with direct multiplication to avoid negative base undefined behavior in GLSL
133
+ float shadowFactor = 1.0 - v_displacement_amount;
134
+ color -= shadowFactor * shadowFactor * u_shadows;
716
135
  color = saturation(color, 1.0 + u_saturation);
717
136
  color = color * u_brightness;
718
137
 
719
138
  // Grain
720
139
  vec2 noiseCoords = gl_FragCoord.xy / u_grain_scale;
721
- float grain = (u_grain_speed != 0.0) ? fbm(vec3(noiseCoords, u_time * u_grain_speed)) : fbm(vec3(noiseCoords, 0.0));
140
+ float grain = 0.0;
141
+
142
+ // Completely bypass expensive noise generation if grain is disabled
143
+ if (u_grain_intensity > 0.0) {
144
+ if (u_grain_speed != 0.0) {
145
+ grain = fbm(vec3(noiseCoords, u_time * u_grain_speed));
146
+ } else {
147
+ grain = fbm(vec3(noiseCoords, 0.0));
148
+ }
722
149
 
723
- grain = grain * 0.5 + 0.5;
724
- grain -= 0.5;
725
- grain = (grain > u_grain_sparsity) ? grain : 0.0;
726
- grain *= u_grain_intensity;
150
+ grain = grain * 0.5 + 0.5;
151
+ grain -= 0.5;
152
+ grain = (grain > u_grain_sparsity) ? grain : 0.0;
153
+ grain *= u_grain_intensity;
154
+ }
727
155
 
728
156
  color += vec3(grain);
729
157
 
730
158
  gl_FragColor = vec4(color, 1.0);
731
159
  }
732
- `, A);
733
- }
734
- let k = null;
735
- const H = () => k || (k = `
736
- precision highp float;
160
+ `;
161
+ function me() {
162
+ return `precision highp float;
737
163
 
738
- struct Color {
739
- float is_active;
740
- vec3 color;
741
- float value;
742
- };
164
+ attribute vec3 position;
165
+ attribute vec3 normal;
166
+ attribute vec2 uv;
743
167
 
744
- uniform float u_grain_intensity;
745
- uniform float u_grain_sparsity;
746
- uniform float u_grain_scale;
747
- uniform float u_grain_speed;
748
- uniform float u_time;
168
+ uniform mat4 modelViewMatrix;
169
+ uniform mat4 projectionMatrix;
749
170
 
750
- uniform float u_wave_amplitude;
751
- uniform float u_wave_frequency_x;
752
- uniform float u_wave_frequency_y;
171
+ varying vec2 vUv;
172
+ varying vec2 vFlowUv;
173
+ varying vec4 v_new_position;
174
+ varying vec3 v_color;
175
+ varying float v_displacement_amount;
753
176
 
177
+ uniform float u_time;
178
+ uniform vec2 u_resolution;
754
179
  uniform vec2 u_color_pressure;
755
-
180
+ uniform float u_wave_frequency_x;
181
+ uniform float u_wave_frequency_y;
182
+ uniform float u_wave_amplitude;
756
183
  uniform float u_plane_width;
757
184
  uniform float u_plane_height;
758
-
759
- uniform float u_shadows;
760
- uniform float u_highlights;
761
- uniform float u_saturation;
762
- uniform float u_brightness;
763
-
764
185
  uniform float u_color_blending;
765
186
 
766
187
  uniform int u_colors_count;
767
- uniform Color u_colors[6];
768
- uniform vec2 u_resolution;
188
+ struct ColorStop {
189
+ float is_active;
190
+ vec3 color;
191
+ float influence;
192
+ };
193
+ uniform ColorStop u_colors[6];
769
194
 
770
195
  uniform float u_y_offset;
771
196
  uniform float u_y_offset_wave_multiplier;
@@ -778,28 +203,44 @@ uniform float u_flow_distortion_b;
778
203
  uniform float u_flow_scale;
779
204
  uniform float u_flow_ease;
780
205
  uniform float u_flow_enabled;
206
+ `;
207
+ }
208
+ function pe() {
209
+ return `precision highp float;
210
+
211
+ varying vec2 vUv;
212
+ varying vec2 vFlowUv;
213
+ varying vec3 v_color;
214
+ varying float v_displacement_amount;
781
215
 
782
- // Mouse interaction uniforms
783
- uniform float u_mouse_distortion_strength;
784
- uniform float u_mouse_distortion_radius;
785
- uniform float u_mouse_darken;
786
- uniform sampler2D u_mouse_texture;
216
+ uniform float u_time;
217
+ uniform float u_plane_height;
218
+
219
+ uniform float u_shadows;
220
+ uniform float u_highlights;
221
+ uniform float u_saturation;
222
+ uniform float u_brightness;
223
+ uniform float u_grain_intensity;
224
+ uniform float u_grain_sparsity;
225
+ uniform float u_grain_scale;
226
+ uniform float u_grain_speed;
227
+
228
+ uniform float u_y_offset;
229
+ uniform float u_y_offset_color_multiplier;
230
+
231
+ // Flow field uniforms
232
+ uniform float u_flow_distortion_a;
233
+ uniform float u_flow_distortion_b;
234
+ uniform float u_flow_scale;
787
235
 
788
236
  // Procedural texture uniforms
789
237
  uniform sampler2D u_procedural_texture;
790
238
  uniform float u_enable_procedural_texture;
791
239
  uniform float u_texture_ease;
792
-
793
- varying vec2 vUv;
794
- varying vec2 vFlowUv;
795
- varying vec4 v_new_position;
796
- varying vec3 v_color;
797
- varying float v_displacement_amount;
798
-
799
- `, k);
800
- let I = null;
801
- const Y = () => I || (I = `
802
-
240
+ `;
241
+ }
242
+ function Y() {
243
+ return `
803
244
  // 1. REPLACEMENT PERMUTE:
804
245
  // Uses a hash function (fract/sin) instead of a modular lookup table.
805
246
  vec4 permute(vec4 x) {
@@ -951,81 +392,703 @@ float cnoise(vec3 P)
951
392
  float n_xyz = mix(n_yz.x, n_yz.y, fade_xyz.x);
952
393
  return 2.2 * n_xyz;
953
394
  }
954
- `, I);
955
- let W = null;
956
- const Z = () => W || (W = `
957
-
395
+ `;
396
+ }
397
+ function j() {
398
+ return `
958
399
  vec3 saturation(vec3 rgb, float adjustment) {
959
400
  const vec3 W = vec3(0.2125, 0.7154, 0.0721);
960
401
  vec3 intensity = vec3(dot(rgb, W));
961
402
  return mix(intensity, rgb, adjustment);
962
403
  }
963
-
964
- float saturation(vec3 rgb)
965
- {
966
- vec4 K = vec4(0.0, -1.0 / 3.0, 2.0 / 3.0, -1.0);
967
- vec4 p = mix(vec4(rgb.bg, K.wz), vec4(rgb.gb, K.xy), step(rgb.b, rgb.g));
968
- vec4 q = mix(vec4(p.xyw, rgb.r), vec4(rgb.r, p.yzx), step(p.x, rgb.r));
969
-
970
- float d = q.x - min(q.w, q.y);
971
- float e = 1.0e-10;
972
- return abs(6.0 * d + e);
404
+ `;
973
405
  }
974
-
975
- // get saturation of a color in values between 0 and 1
976
- float getSaturation(vec3 color) {
977
- float max = max(color.r, max(color.g, color.b));
978
- float min = min(color.r, min(color.g, color.b));
979
- return (max - min) / max;
406
+ class J {
407
+ elements;
408
+ constructor() {
409
+ this.elements = new Float32Array([
410
+ 1,
411
+ 0,
412
+ 0,
413
+ 0,
414
+ 0,
415
+ 1,
416
+ 0,
417
+ 0,
418
+ 0,
419
+ 0,
420
+ 1,
421
+ 0,
422
+ 0,
423
+ 0,
424
+ 0,
425
+ 1
426
+ ]);
427
+ }
428
+ translate(e, i, o) {
429
+ return this.elements[12] += this.elements[0] * e + this.elements[4] * i + this.elements[8] * o, this.elements[13] += this.elements[1] * e + this.elements[5] * i + this.elements[9] * o, this.elements[14] += this.elements[2] * e + this.elements[6] * i + this.elements[10] * o, this.elements[15] += this.elements[3] * e + this.elements[7] * i + this.elements[11] * o, this;
430
+ }
431
+ rotateX(e) {
432
+ const i = Math.cos(e), o = Math.sin(e), t = this.elements[4], b = this.elements[5], y = this.elements[6], n = this.elements[7], p = this.elements[8], v = this.elements[9], T = this.elements[10], x = this.elements[11];
433
+ return this.elements[4] = i * t + o * p, this.elements[5] = i * b + o * v, this.elements[6] = i * y + o * T, this.elements[7] = i * n + o * x, this.elements[8] = i * p - o * t, this.elements[9] = i * v - o * b, this.elements[10] = i * T - o * y, this.elements[11] = i * x - o * n, this;
434
+ }
980
435
  }
981
-
982
- vec3 rgb2hsv(vec3 c)
983
- {
984
- vec4 K = vec4(0.0, -1.0 / 3.0, 2.0 / 3.0, -1.0);
985
- vec4 p = mix(vec4(c.bg, K.wz), vec4(c.gb, K.xy), step(c.b, c.g));
986
- vec4 q = mix(vec4(p.xyw, c.r), vec4(c.r, p.yzx), step(p.x, c.r));
987
-
988
- float d = q.x - min(q.w, q.y);
989
- float e = 1.0e-10;
990
- return vec3(abs(q.z + (q.w - q.y) / (6.0 * d + e)), d / (q.x + e), q.x);
436
+ class ge {
437
+ left;
438
+ right;
439
+ top;
440
+ bottom;
441
+ near;
442
+ far;
443
+ position;
444
+ projectionMatrix;
445
+ constructor(e, i, o, t, b, y) {
446
+ this.left = e, this.right = i, this.top = o, this.bottom = t, this.near = b, this.far = y, this.position = [0, 0, 0], this.projectionMatrix = new J(), this.updateProjectionMatrix();
447
+ }
448
+ updateProjectionMatrix() {
449
+ const e = 1 / (this.right - this.left), i = 1 / (this.top - this.bottom), o = 1 / (this.far - this.near), t = (this.right + this.left) * e, b = (this.top + this.bottom) * i, y = (this.far + this.near) * o;
450
+ this.projectionMatrix.elements = new Float32Array([
451
+ 2 * e,
452
+ 0,
453
+ 0,
454
+ 0,
455
+ 0,
456
+ 2 * i,
457
+ 0,
458
+ 0,
459
+ 0,
460
+ 0,
461
+ -2 * o,
462
+ 0,
463
+ -t,
464
+ -b,
465
+ -y,
466
+ 1
467
+ ]);
468
+ }
991
469
  }
992
-
993
- vec3 hsv2rgb(vec3 c)
994
- {
995
- vec4 K = vec4(1.0, 2.0 / 3.0, 1.0 / 3.0, 3.0);
996
- vec3 p = abs(fract(c.xxx + K.xyz) * 6.0 - K.www);
997
- return c.z * mix(K.xxx, clamp(p - K.xxx, 0.0, 1.0), c.y);
470
+ function H(a, e, i, o = 50, t = 50) {
471
+ const n = e * i / 1e6 * o * t / 1.5, p = e / i, v = Math.sqrt(n * p), T = n / v;
472
+ let x = -o / 2, h = Math.min((x + v) / 1.5, o / 2), w = t / 4, R = Math.max((w - T) / 2, -t / 4);
473
+ if (p < 1) {
474
+ const E = p;
475
+ x = x * E, h = h * E;
476
+ const g = 1.05;
477
+ x = x * g, h = h * g, w = w * g, R = R * g;
478
+ }
479
+ a.left = x, a.right = h, a.top = w, a.bottom = R, a.near = -100, a.far = 1e3, a.updateProjectionMatrix();
480
+ }
481
+ function xe(a, e, i, o) {
482
+ const t = a / 2, b = e / 2, y = Math.floor(i), n = Math.floor(o), p = y + 1, v = n + 1, T = a / y, x = e / n, h = [], w = [], R = [], E = [];
483
+ for (let c = 0; c < v; c++) {
484
+ const l = c * x - b;
485
+ for (let m = 0; m < p; m++) {
486
+ const s = m * T - t;
487
+ w.push(s, -l, 0), R.push(0, 0, 1), E.push(m / y), E.push(1 - c / n);
488
+ }
489
+ }
490
+ for (let c = 0; c < n; c++)
491
+ for (let l = 0; l < y; l++) {
492
+ const m = l + p * c, s = l + p * (c + 1), f = l + 1 + p * (c + 1), _ = l + 1 + p * c;
493
+ h.push(m, s, _), h.push(s, f, _);
494
+ }
495
+ const g = w.length / 3 > 65535, A = [];
496
+ for (let c = 0; c < h.length; c += 3) {
497
+ const l = h[c], m = h[c + 1], s = h[c + 2];
498
+ A.push(l, m, m, s, s, l);
499
+ }
500
+ return {
501
+ position: new Float32Array(w),
502
+ normal: new Float32Array(R),
503
+ uv: new Float32Array(E),
504
+ index: g ? new Uint32Array(h) : new Uint16Array(h),
505
+ wireframeIndex: g ? new Uint32Array(A) : new Uint16Array(A)
506
+ };
507
+ }
508
+ console.info(
509
+ `%c\u{1F308} Neat Gradients%c
510
+
511
+ Licensed under MIT + The Commons Clause.
512
+ Free for personal and commercial use.
513
+ Selling this software or its derivatives is strictly prohibited.
514
+ https://neat.firecms.co`,
515
+ "font-weight: bold; font-size: 14px; color: #FF5772;",
516
+ "color: inherit;"
517
+ );
518
+ const $ = 50, K = 80, O = 6, ye = Se();
519
+ class Te {
520
+ _ref;
521
+ _speed = -1;
522
+ _horizontalPressure = -1;
523
+ _verticalPressure = -1;
524
+ _waveFrequencyX = -1;
525
+ _waveFrequencyY = -1;
526
+ _waveAmplitude = -1;
527
+ _shadows = -1;
528
+ _highlights = -1;
529
+ _saturation = -1;
530
+ _brightness = -1;
531
+ _grainScale = -1;
532
+ _grainIntensity = -1;
533
+ _grainSparsity = -1;
534
+ _grainSpeed = -1;
535
+ _colorBlending = -1;
536
+ _colors = [];
537
+ _wireframe = !1;
538
+ _backgroundColor = "#FFFFFF";
539
+ _backgroundColorRgb = [1, 1, 1];
540
+ _backgroundAlpha = 1;
541
+ _flowDistortionA = 0;
542
+ _flowDistortionB = 0;
543
+ _flowScale = 1;
544
+ _flowEase = 0;
545
+ _flowEnabled = !0;
546
+ glState;
547
+ _enableProceduralTexture = !1;
548
+ _textureVoidLikelihood = 0.45;
549
+ _textureVoidWidthMin = 200;
550
+ _textureVoidWidthMax = 486;
551
+ _textureBandDensity = 2.15;
552
+ _textureColorBlending = 0.01;
553
+ _textureSeed = 333;
554
+ _textureEase = 0.5;
555
+ _proceduralTexture = null;
556
+ _proceduralBackgroundColor = "#000000";
557
+ _textureShapeTriangles = 20;
558
+ _textureShapeCircles = 15;
559
+ _textureShapeBars = 15;
560
+ _textureShapeSquiggles = 10;
561
+ requestRef = -1;
562
+ sizeObserver;
563
+ _initialized = !1;
564
+ _linkElement = null;
565
+ _cachedColorRgb = [];
566
+ _yOffset = 0;
567
+ _yOffsetWaveMultiplier = 4e-3;
568
+ _yOffsetColorMultiplier = 4e-3;
569
+ _yOffsetFlowMultiplier = 4e-3;
570
+ _resizeTimeoutId = null;
571
+ _textureNeedsUpdate = !1;
572
+ _linkCheckCounter = 0;
573
+ _colorsChanged = !0;
574
+ _uniformsDirty = !0;
575
+ _textureDirty = !0;
576
+ constructor(e) {
577
+ const {
578
+ ref: i,
579
+ speed: o = 4,
580
+ horizontalPressure: t = 3,
581
+ verticalPressure: b = 3,
582
+ waveFrequencyX: y = 5,
583
+ waveFrequencyY: n = 5,
584
+ waveAmplitude: p = 3,
585
+ colors: v,
586
+ highlights: T = 4,
587
+ shadows: x = 4,
588
+ colorSaturation: h = 0,
589
+ colorBrightness: w = 1,
590
+ colorBlending: R = 5,
591
+ grainScale: E = 2,
592
+ grainIntensity: g = 0.55,
593
+ grainSparsity: A = 0,
594
+ grainSpeed: c = 0.1,
595
+ wireframe: l = !1,
596
+ backgroundColor: m = "#FFFFFF",
597
+ backgroundAlpha: s = 1,
598
+ resolution: f = 1,
599
+ seed: _,
600
+ yOffset: d = 0,
601
+ yOffsetWaveMultiplier: z = 4,
602
+ yOffsetColorMultiplier: C = 4,
603
+ yOffsetFlowMultiplier: F = 4,
604
+ flowDistortionA: M = 0,
605
+ flowDistortionB: N = 0,
606
+ flowScale: W = 1,
607
+ flowEase: D = 0,
608
+ flowEnabled: S = !0,
609
+ enableProceduralTexture: U = !1,
610
+ textureVoidLikelihood: Q = 0.45,
611
+ textureVoidWidthMin: ee = 200,
612
+ textureVoidWidthMax: te = 486,
613
+ textureBandDensity: ie = 2.15,
614
+ textureColorBlending: re = 0.01,
615
+ textureSeed: oe = 333,
616
+ textureEase: se = 0.5,
617
+ proceduralBackgroundColor: ne = "#000000",
618
+ textureShapeTriangles: ae = 20,
619
+ textureShapeCircles: le = 15,
620
+ textureShapeBars: ue = 15,
621
+ textureShapeSquiggles: fe = 10
622
+ } = e;
623
+ this._ref = i, this.destroy = this.destroy.bind(this), this._initScene = this._initScene.bind(this), this.speed = o, this.horizontalPressure = t, this.verticalPressure = b, this.waveFrequencyX = y, this.waveFrequencyY = n, this.waveAmplitude = p, this.colorBlending = R, this.grainScale = E, this.grainIntensity = g, this.grainSparsity = A, this.grainSpeed = c, this.colors = v, this.shadows = x, this.highlights = T, this.colorSaturation = h, this.colorBrightness = w, this.wireframe = l, this.backgroundColor = m, this.backgroundAlpha = s, this.yOffset = d, this.yOffsetWaveMultiplier = z, this.yOffsetColorMultiplier = C, this.yOffsetFlowMultiplier = F, this.flowDistortionA = M, this.flowDistortionB = N, this.flowScale = W, this.flowEase = D, this.flowEnabled = S, this.enableProceduralTexture = U, this.textureVoidLikelihood = Q, this.textureVoidWidthMin = ee, this.textureVoidWidthMax = te, this.textureBandDensity = ie, this.textureColorBlending = re, this.textureSeed = oe, this.textureEase = se, this._proceduralBackgroundColor = ne, this._textureShapeTriangles = ae, this._textureShapeCircles = le, this._textureShapeBars = ue, this._textureShapeSquiggles = fe, this.glState = this._initScene(f), Ee();
624
+ let k = _ !== void 0 ? _ : we(), X = performance.now();
625
+ const q = () => {
626
+ const { gl: r, program: I, locations: u, indexCount: B, indexType: L } = this.glState;
627
+ if (this._linkCheckCounter++, this._linkCheckCounter >= 300 && (this._linkCheckCounter = 0, (!this._linkElement || !document.contains(this._linkElement)) && (this._linkElement = ve(i))), this._initialized) {
628
+ const V = performance.now();
629
+ if (k += (V - X) / 1e3 * this._speed, X = V, r.useProgram(I), r.uniform1f(u.uniforms.u_time, k), this._uniformsDirty && (r.uniform2f(u.uniforms.u_resolution, this._ref.clientWidth, this._ref.clientHeight), r.uniform2f(u.uniforms.u_color_pressure, this._horizontalPressure, this._verticalPressure), r.uniform1f(u.uniforms.u_wave_frequency_x, this._waveFrequencyX), r.uniform1f(u.uniforms.u_wave_frequency_y, this._waveFrequencyY), r.uniform1f(u.uniforms.u_wave_amplitude, this._waveAmplitude), r.uniform1f(u.uniforms.u_color_blending, this._colorBlending), r.uniform1f(u.uniforms.u_shadows, this._shadows), r.uniform1f(u.uniforms.u_highlights, this._highlights), r.uniform1f(u.uniforms.u_saturation, this._saturation), r.uniform1f(u.uniforms.u_brightness, this._brightness), r.uniform1f(u.uniforms.u_grain_intensity, this._grainIntensity), r.uniform1f(u.uniforms.u_grain_sparsity, this._grainSparsity), r.uniform1f(u.uniforms.u_grain_speed, this._grainSpeed), r.uniform1f(u.uniforms.u_grain_scale, this._grainScale), r.uniform1f(u.uniforms.u_y_offset, this._yOffset), r.uniform1f(u.uniforms.u_y_offset_wave_multiplier, this._yOffsetWaveMultiplier), r.uniform1f(u.uniforms.u_y_offset_color_multiplier, this._yOffsetColorMultiplier), r.uniform1f(u.uniforms.u_y_offset_flow_multiplier, this._yOffsetFlowMultiplier), r.uniform1f(u.uniforms.u_flow_distortion_a, this._flowDistortionA), r.uniform1f(u.uniforms.u_flow_distortion_b, this._flowDistortionB), r.uniform1f(u.uniforms.u_flow_scale, this._flowScale), r.uniform1f(u.uniforms.u_flow_ease, this._flowEase), r.uniform1f(u.uniforms.u_flow_enabled, this._flowEnabled ? 1 : 0), r.uniform1f(u.uniforms.u_enable_procedural_texture, this._enableProceduralTexture ? 1 : 0), r.uniform1f(u.uniforms.u_texture_ease, this._textureEase), this._uniformsDirty = !1), this._textureNeedsUpdate && this._enableProceduralTexture && (this._proceduralTexture && r.deleteTexture(this._proceduralTexture), this._proceduralTexture = this._createProceduralTexture(r), this._textureNeedsUpdate = !1, this._textureDirty = !0), this._textureDirty && this._proceduralTexture && (r.activeTexture(r.TEXTURE1), r.bindTexture(r.TEXTURE_2D, this._proceduralTexture), r.uniform1i(u.uniforms.u_procedural_texture, 1), this._textureDirty = !1), this._colorsChanged) {
630
+ this._colorsChanged = !1;
631
+ for (let P = 0; P < O; P++)
632
+ if (P < this._colors.length) {
633
+ const G = this._colors[P], _e = this._cachedColorRgb[P] || [0, 0, 0];
634
+ r.uniform1f(u.uniforms[`u_colors[${P}].is_active`], G.enabled ? 1 : 0), r.uniform3fv(u.uniforms[`u_colors[${P}].color`], _e), r.uniform1f(u.uniforms[`u_colors[${P}].influence`], G.influence || 0);
635
+ } else
636
+ r.uniform1f(u.uniforms[`u_colors[${P}].is_active`], 0);
637
+ r.uniform1i(u.uniforms.u_colors_count, O);
638
+ }
639
+ }
640
+ r.clearColor(
641
+ this._backgroundColorRgb[0],
642
+ this._backgroundColorRgb[1],
643
+ this._backgroundColorRgb[2],
644
+ this._backgroundAlpha
645
+ ), r.clear(r.COLOR_BUFFER_BIT | r.DEPTH_BUFFER_BIT), this._wireframe ? (r.bindBuffer(r.ELEMENT_ARRAY_BUFFER, this.glState.buffers.wireframeIndex), r.drawElements(r.LINES, this.glState.wireframeIndexCount, L, 0), r.bindBuffer(r.ELEMENT_ARRAY_BUFFER, this.glState.buffers.index)) : r.drawElements(r.TRIANGLES, B, L, 0), this.requestRef = requestAnimationFrame(q);
646
+ }, ce = () => {
647
+ const { gl: r, camera: I } = this.glState, u = this._ref.clientWidth, B = this._ref.clientHeight;
648
+ this._ref.width = u, this._ref.height = B, r.viewport(0, 0, u, B), H(I, u, B);
649
+ const L = r.getUniformLocation(this.glState.program, "projectionMatrix");
650
+ r.useProgram(this.glState.program), r.uniformMatrix4fv(L, !1, I.projectionMatrix.elements);
651
+ };
652
+ this.sizeObserver = new ResizeObserver(() => {
653
+ this._resizeTimeoutId !== null && clearTimeout(this._resizeTimeoutId), this._resizeTimeoutId = window.setTimeout(() => {
654
+ ce(), this._resizeTimeoutId = null;
655
+ }, 100);
656
+ }), this.sizeObserver.observe(i), q();
657
+ }
658
+ destroy() {
659
+ if (cancelAnimationFrame(this.requestRef), this.sizeObserver.disconnect(), this._resizeTimeoutId !== null && (clearTimeout(this._resizeTimeoutId), this._resizeTimeoutId = null), this._linkElement && this._linkElement.parentElement && (this._linkElement.parentElement.removeChild(this._linkElement), this._linkElement = null), this.glState) {
660
+ const e = this.glState.gl;
661
+ e.deleteProgram(this.glState.program), e.deleteBuffer(this.glState.buffers.position), e.deleteBuffer(this.glState.buffers.normal), e.deleteBuffer(this.glState.buffers.uv), e.deleteBuffer(this.glState.buffers.index), e.deleteBuffer(this.glState.buffers.wireframeIndex);
662
+ }
663
+ this._proceduralTexture && this.glState && this.glState.gl.deleteTexture(this._proceduralTexture);
664
+ }
665
+ downloadAsPNG(e = "neat.png") {
666
+ const i = this._ref.toDataURL("image/png");
667
+ be(i, e);
668
+ }
669
+ set speed(e) {
670
+ this._uniformsDirty = !0, this._speed = e / 20;
671
+ }
672
+ set horizontalPressure(e) {
673
+ this._uniformsDirty = !0, this._horizontalPressure = e / 4;
674
+ }
675
+ set verticalPressure(e) {
676
+ this._uniformsDirty = !0, this._verticalPressure = e / 4;
677
+ }
678
+ set waveFrequencyX(e) {
679
+ this._uniformsDirty = !0, this._waveFrequencyX = e * 0.04;
680
+ }
681
+ set waveFrequencyY(e) {
682
+ this._uniformsDirty = !0, this._waveFrequencyY = e * 0.04;
683
+ }
684
+ set waveAmplitude(e) {
685
+ this._uniformsDirty = !0, this._waveAmplitude = e * 0.75;
686
+ }
687
+ set colors(e) {
688
+ this._uniformsDirty = !0, this._colors = e, this._cachedColorRgb = e.map((i) => this._hexToRgb(i.color)), this._colorsChanged = !0;
689
+ }
690
+ set highlights(e) {
691
+ this._uniformsDirty = !0, this._highlights = e / 100;
692
+ }
693
+ set shadows(e) {
694
+ this._uniformsDirty = !0, this._shadows = e / 100;
695
+ }
696
+ set colorSaturation(e) {
697
+ this._uniformsDirty = !0, this._saturation = e / 10;
698
+ }
699
+ set colorBrightness(e) {
700
+ this._uniformsDirty = !0, this._brightness = e;
701
+ }
702
+ set colorBlending(e) {
703
+ this._uniformsDirty = !0, this._colorBlending = e / 10;
704
+ }
705
+ set grainScale(e) {
706
+ this._uniformsDirty = !0, this._grainScale = e == 0 ? 1 : e;
707
+ }
708
+ set grainIntensity(e) {
709
+ this._uniformsDirty = !0, this._grainIntensity = e;
710
+ }
711
+ set grainSparsity(e) {
712
+ this._uniformsDirty = !0, this._grainSparsity = e;
713
+ }
714
+ set grainSpeed(e) {
715
+ this._uniformsDirty = !0, this._grainSpeed = e;
716
+ }
717
+ set wireframe(e) {
718
+ this._uniformsDirty = !0, this._wireframe = e;
719
+ }
720
+ set resolution(e) {
721
+ if (this._uniformsDirty = !0, this.glState) {
722
+ const i = this.glState.gl;
723
+ i.deleteProgram(this.glState.program), i.deleteBuffer(this.glState.buffers.position), i.deleteBuffer(this.glState.buffers.normal), i.deleteBuffer(this.glState.buffers.uv), i.deleteBuffer(this.glState.buffers.index), i.deleteBuffer(this.glState.buffers.wireframeIndex);
724
+ }
725
+ this.glState = this._initScene(e);
726
+ }
727
+ set backgroundColor(e) {
728
+ this._uniformsDirty = !0, this._backgroundColor = e, this._backgroundColorRgb = this._hexToRgb(e);
729
+ }
730
+ set backgroundAlpha(e) {
731
+ this._uniformsDirty = !0, this._backgroundAlpha = e;
732
+ }
733
+ set yOffset(e) {
734
+ this._uniformsDirty = !0, this._yOffset = e;
735
+ }
736
+ get yOffsetWaveMultiplier() {
737
+ return this._yOffsetWaveMultiplier * 1e3;
738
+ }
739
+ set yOffsetWaveMultiplier(e) {
740
+ this._uniformsDirty = !0, this._yOffsetWaveMultiplier = e / 1e3;
741
+ }
742
+ get yOffsetColorMultiplier() {
743
+ return this._yOffsetColorMultiplier * 1e3;
744
+ }
745
+ set yOffsetColorMultiplier(e) {
746
+ this._uniformsDirty = !0, this._yOffsetColorMultiplier = e / 1e3;
747
+ }
748
+ get yOffsetFlowMultiplier() {
749
+ return this._yOffsetFlowMultiplier * 1e3;
750
+ }
751
+ set yOffsetFlowMultiplier(e) {
752
+ this._uniformsDirty = !0, this._yOffsetFlowMultiplier = e / 1e3;
753
+ }
754
+ set flowDistortionA(e) {
755
+ this._uniformsDirty = !0, this._flowDistortionA = e;
756
+ }
757
+ set flowDistortionB(e) {
758
+ this._uniformsDirty = !0, this._flowDistortionB = e;
759
+ }
760
+ set flowScale(e) {
761
+ this._uniformsDirty = !0, this._flowScale = e;
762
+ }
763
+ set flowEase(e) {
764
+ this._uniformsDirty = !0, this._flowEase = e;
765
+ }
766
+ set flowEnabled(e) {
767
+ this._uniformsDirty = !0, this._flowEnabled = e;
768
+ }
769
+ get flowEnabled() {
770
+ return this._flowEnabled;
771
+ }
772
+ set enableProceduralTexture(e) {
773
+ this._uniformsDirty = !0, this._enableProceduralTexture = e, e && !this._proceduralTexture && (this._textureNeedsUpdate = !0);
774
+ }
775
+ set textureVoidLikelihood(e) {
776
+ this._uniformsDirty = !0, this._textureVoidLikelihood = e, this._enableProceduralTexture && (this._textureNeedsUpdate = !0);
777
+ }
778
+ set textureVoidWidthMin(e) {
779
+ this._uniformsDirty = !0, this._textureVoidWidthMin = e, this._enableProceduralTexture && (this._textureNeedsUpdate = !0);
780
+ }
781
+ set textureVoidWidthMax(e) {
782
+ this._uniformsDirty = !0, this._textureVoidWidthMax = e, this._enableProceduralTexture && (this._textureNeedsUpdate = !0);
783
+ }
784
+ set textureBandDensity(e) {
785
+ this._uniformsDirty = !0, this._textureBandDensity = e, this._enableProceduralTexture && (this._textureNeedsUpdate = !0);
786
+ }
787
+ set textureColorBlending(e) {
788
+ this._uniformsDirty = !0, this._textureColorBlending = e, this._enableProceduralTexture && (this._textureNeedsUpdate = !0);
789
+ }
790
+ set textureSeed(e) {
791
+ this._uniformsDirty = !0, this._textureSeed = e, this._enableProceduralTexture && (this._textureNeedsUpdate = !0);
792
+ }
793
+ get textureEase() {
794
+ return this._textureEase;
795
+ }
796
+ set textureEase(e) {
797
+ this._uniformsDirty = !0, this._textureEase = e;
798
+ }
799
+ set proceduralBackgroundColor(e) {
800
+ this._uniformsDirty = !0, this._proceduralBackgroundColor = e, this._enableProceduralTexture && (this._textureNeedsUpdate = !0);
801
+ }
802
+ set textureShapeTriangles(e) {
803
+ this._uniformsDirty = !0, this._textureShapeTriangles = e, this._enableProceduralTexture && (this._textureNeedsUpdate = !0);
804
+ }
805
+ set textureShapeCircles(e) {
806
+ this._uniformsDirty = !0, this._textureShapeCircles = e, this._enableProceduralTexture && (this._textureNeedsUpdate = !0);
807
+ }
808
+ set textureShapeBars(e) {
809
+ this._uniformsDirty = !0, this._textureShapeBars = e, this._enableProceduralTexture && (this._textureNeedsUpdate = !0);
810
+ }
811
+ set textureShapeSquiggles(e) {
812
+ this._uniformsDirty = !0, this._textureShapeSquiggles = e, this._enableProceduralTexture && (this._textureNeedsUpdate = !0);
813
+ }
814
+ _hexToRgb(e) {
815
+ const i = parseInt(e.replace("#", ""), 16);
816
+ return [
817
+ (i >> 16 & 255) / 255,
818
+ (i >> 8 & 255) / 255,
819
+ (i & 255) / 255
820
+ ];
821
+ }
822
+ _initScene(e) {
823
+ const i = this._ref.clientWidth, o = this._ref.clientHeight, t = this._ref.getContext("webgl2", { alpha: !0, preserveDrawingBuffer: !0, antialias: !0 }) || this._ref.getContext("webgl", { alpha: !0, preserveDrawingBuffer: !0, antialias: !0 });
824
+ if (!t)
825
+ throw new Error("WebGL not supported");
826
+ t.getExtension("OES_standard_derivatives"), t.getExtension("OES_element_index_uint"), t.viewport(0, 0, i, o);
827
+ const { position: b, normal: y, uv: n, index: p, wireframeIndex: v } = xe($, K, 240 * e, 240 * e), T = t.createBuffer();
828
+ t.bindBuffer(t.ARRAY_BUFFER, T), t.bufferData(t.ARRAY_BUFFER, b, t.STATIC_DRAW);
829
+ const x = t.createBuffer();
830
+ t.bindBuffer(t.ARRAY_BUFFER, x), t.bufferData(t.ARRAY_BUFFER, y, t.STATIC_DRAW);
831
+ const h = t.createBuffer();
832
+ t.bindBuffer(t.ARRAY_BUFFER, h), t.bufferData(t.ARRAY_BUFFER, n, t.STATIC_DRAW);
833
+ const w = t.createBuffer();
834
+ t.bindBuffer(t.ELEMENT_ARRAY_BUFFER, w), t.bufferData(t.ELEMENT_ARRAY_BUFFER, p, t.STATIC_DRAW);
835
+ const R = t.createBuffer();
836
+ t.bindBuffer(t.ELEMENT_ARRAY_BUFFER, R), t.bufferData(t.ELEMENT_ARRAY_BUFFER, v, t.STATIC_DRAW), t.bindBuffer(t.ELEMENT_ARRAY_BUFFER, w);
837
+ const E = me() + `
838
+ ` + Y() + `
839
+ ` + j() + `
840
+ ` + he, g = t.createShader(t.VERTEX_SHADER);
841
+ t.shaderSource(g, E), t.compileShader(g), t.getShaderParameter(g, t.COMPILE_STATUS) || (console.log("VERTEX_SHADER_ERROR_START"), console.log("Vertex shader error: ", t.getShaderInfoLog(g)), console.log("GL Error Code:", t.getError()), console.log("Vertex Shader Source Dump:"), console.log(E.split(`
842
+ `).map((S, U) => `${U + 1}: ${S}`).join(`
843
+ `)), console.log("VERTEX_SHADER_ERROR_END"));
844
+ const A = pe() + `
845
+ ` + j() + `
846
+ ` + Y() + `
847
+ ` + de, c = t.createShader(t.FRAGMENT_SHADER);
848
+ t.shaderSource(c, A), t.compileShader(c), t.getShaderParameter(c, t.COMPILE_STATUS) || (console.log("FRAGMENT_SHADER_ERROR_START"), console.log("Fragment shader error: ", t.getShaderInfoLog(c)), console.log("GL Error Code:", t.getError()), console.log("Fragment Shader Source Dump:"), console.log(A.split(`
849
+ `).map((S, U) => `${U + 1}: ${S}`).join(`
850
+ `)), console.log("FRAGMENT_SHADER_ERROR_END"));
851
+ const l = t.createProgram();
852
+ t.attachShader(l, g), t.attachShader(l, c), t.linkProgram(l), t.getProgramParameter(l, t.LINK_STATUS) || (console.log("PROGRAM_LINK_ERROR_START"), console.log("Program linking error: ", t.getProgramInfoLog(l)), console.log("GL Error Code:", t.getError()), console.log("PROGRAM_LINK_ERROR_END")), t.useProgram(l);
853
+ const m = new ge(0, 0, 0, 0, 0, 1e3);
854
+ m.position = [0, 0, 5], H(m, i, o);
855
+ const s = t.getAttribLocation(l, "position"), f = t.getAttribLocation(l, "normal"), _ = t.getAttribLocation(l, "uv");
856
+ t.enableVertexAttribArray(s), t.bindBuffer(t.ARRAY_BUFFER, T), t.vertexAttribPointer(s, 3, t.FLOAT, !1, 0, 0), t.enableVertexAttribArray(f), t.bindBuffer(t.ARRAY_BUFFER, x), t.vertexAttribPointer(f, 3, t.FLOAT, !1, 0, 0), t.enableVertexAttribArray(_), t.bindBuffer(t.ARRAY_BUFFER, h), t.vertexAttribPointer(_, 2, t.FLOAT, !1, 0, 0), t.bindBuffer(t.ELEMENT_ARRAY_BUFFER, w);
857
+ const d = new J();
858
+ d.translate(-m.position[0], -m.position[1], -m.position[2]), d.translate(0, 0, -1), d.rotateX(-Math.PI / 3.5);
859
+ const z = t.getUniformLocation(l, "modelViewMatrix");
860
+ t.uniformMatrix4fv(z, !1, d.elements);
861
+ const C = t.getUniformLocation(l, "projectionMatrix");
862
+ t.uniformMatrix4fv(C, !1, m.projectionMatrix.elements);
863
+ const F = t.getUniformLocation(l, "u_plane_width");
864
+ t.uniform1f(F, $);
865
+ const M = t.getUniformLocation(l, "u_plane_height");
866
+ t.uniform1f(M, K);
867
+ const N = t.getUniformLocation(l, "u_colors_count");
868
+ t.uniform1i(N, O);
869
+ const W = [
870
+ "u_time",
871
+ "u_resolution",
872
+ "u_color_pressure",
873
+ "u_wave_frequency_x",
874
+ "u_wave_frequency_y",
875
+ "u_wave_amplitude",
876
+ "u_colors_count",
877
+ "u_plane_width",
878
+ "u_plane_height",
879
+ "u_shadows",
880
+ "u_highlights",
881
+ "u_grain_intensity",
882
+ "u_grain_sparsity",
883
+ "u_grain_scale",
884
+ "u_grain_speed",
885
+ "u_flow_distortion_a",
886
+ "u_flow_distortion_b",
887
+ "u_flow_scale",
888
+ "u_flow_ease",
889
+ "u_flow_enabled",
890
+ "u_y_offset",
891
+ "u_y_offset_wave_multiplier",
892
+ "u_y_offset_color_multiplier",
893
+ "u_y_offset_flow_multiplier",
894
+ "u_procedural_texture",
895
+ "u_enable_procedural_texture",
896
+ "u_texture_ease",
897
+ "u_saturation",
898
+ "u_brightness",
899
+ "u_color_blending"
900
+ ], D = {
901
+ attributes: { position: s, normal: f, uv: _ },
902
+ uniforms: {}
903
+ };
904
+ W.forEach((S) => {
905
+ D.uniforms[S] = t.getUniformLocation(l, S);
906
+ });
907
+ for (let S = 0; S < O; S++)
908
+ D.uniforms[`u_colors[${S}].is_active`] = t.getUniformLocation(l, `u_colors[${S}].is_active`), D.uniforms[`u_colors[${S}].color`] = t.getUniformLocation(l, `u_colors[${S}].color`), D.uniforms[`u_colors[${S}].influence`] = t.getUniformLocation(l, `u_colors[${S}].influence`);
909
+ return this._initialized = !0, this._uniformsDirty = !0, this._colorsChanged = !0, this._textureDirty = !0, t.enable(t.BLEND), t.blendFunc(t.SRC_ALPHA, t.ONE_MINUS_SRC_ALPHA), t.enable(t.DEPTH_TEST), {
910
+ gl: t,
911
+ program: l,
912
+ buffers: {
913
+ position: T,
914
+ normal: x,
915
+ uv: h,
916
+ index: w,
917
+ wireframeIndex: R
918
+ },
919
+ locations: D,
920
+ camera: m,
921
+ indexCount: p.length,
922
+ wireframeIndexCount: v.length,
923
+ indexType: p instanceof Uint32Array ? t.UNSIGNED_INT : t.UNSIGNED_SHORT
924
+ };
925
+ }
926
+ _createProceduralTexture(e) {
927
+ const o = document.createElement("canvas");
928
+ o.width = 1024, o.height = 1024;
929
+ const t = o.getContext("2d", { willReadFrequently: !0 });
930
+ if (!t)
931
+ return null;
932
+ let b = this._textureSeed;
933
+ const y = this._textureSeed;
934
+ function n() {
935
+ const s = Math.sin(b++) * 1e4;
936
+ return s - Math.floor(s);
937
+ }
938
+ const p = (s) => {
939
+ b = y + s;
940
+ }, v = this._colors.filter((s) => s.enabled).map((s) => s.color);
941
+ if (v.length === 0)
942
+ return null;
943
+ function T(s) {
944
+ const f = parseInt(s.replace("#", ""), 16);
945
+ return {
946
+ r: f >> 16 & 255,
947
+ g: f >> 8 & 255,
948
+ b: f & 255
949
+ };
950
+ }
951
+ function x(s, f, _) {
952
+ return "#" + ((1 << 24) + (Math.round(s) << 16) + (Math.round(f) << 8) + Math.round(_)).toString(16).slice(1).padStart(6, "0");
953
+ }
954
+ const h = () => {
955
+ const s = v[Math.floor(n() * v.length)], f = v[Math.floor(n() * v.length)], _ = n() * this._textureColorBlending, d = T(s), z = T(f), C = d.r + (z.r - d.r) * _, F = d.g + (z.g - d.g) * _, M = d.b + (z.b - d.b) * _;
956
+ return x(C, F, M);
957
+ }, w = this._proceduralBackgroundColor || "#000000";
958
+ t.fillStyle = w, t.fillRect(0, 0, 1024, 1024);
959
+ const R = t.createLinearGradient(0, 0, 0, 1024);
960
+ R.addColorStop(0, h()), R.addColorStop(1, h()), t.fillStyle = R, t.fillRect(0, 0, 1024, 1024);
961
+ for (let s = 0; s < this._textureShapeTriangles; s++) {
962
+ t.fillStyle = h(), t.beginPath();
963
+ const f = n() * 1024, _ = n() * 1024, d = 100 + n() * 300;
964
+ t.moveTo(f, _), t.lineTo(f + (n() - 0.5) * d, _ + (n() - 0.5) * d), t.lineTo(f + (n() - 0.5) * d, _ + (n() - 0.5) * d), t.fill();
965
+ }
966
+ for (let s = 0; s < this._textureShapeCircles; s++) {
967
+ t.strokeStyle = h(), t.lineWidth = 10 + n() * 50, t.beginPath();
968
+ const f = n() * 1024, _ = n() * 1024, d = 50 + n() * 150;
969
+ t.arc(f, _, d, 0, Math.PI * 2), t.stroke();
970
+ }
971
+ for (let s = 0; s < this._textureShapeBars; s++)
972
+ t.fillStyle = h(), t.save(), t.translate(n() * 1024, n() * 1024), t.rotate(n() * Math.PI), t.fillRect(-150, -25, 300, 50), t.restore();
973
+ t.lineWidth = 15, t.lineCap = "round";
974
+ for (let s = 0; s < this._textureShapeSquiggles; s++) {
975
+ t.strokeStyle = h(), t.beginPath();
976
+ let f = n() * 1024, _ = n() * 1024;
977
+ t.moveTo(f, _);
978
+ for (let d = 0; d < 4; d++)
979
+ t.bezierCurveTo(
980
+ f + (n() - 0.5) * 300,
981
+ _ + (n() - 0.5) * 300,
982
+ f + (n() - 0.5) * 300,
983
+ _ + (n() - 0.5) * 300,
984
+ f + (n() - 0.5) * 300,
985
+ _ + (n() - 0.5) * 300
986
+ ), f += (n() - 0.5) * 300, _ += (n() - 0.5) * 300;
987
+ t.stroke();
988
+ }
989
+ p(5e4);
990
+ const E = document.createElement("canvas");
991
+ E.width = 1024, E.height = 1024;
992
+ const g = E.getContext("2d", { willReadFrequently: !0 });
993
+ if (!g)
994
+ return null;
995
+ g.fillStyle = w, g.fillRect(0, 0, 1024, 1024);
996
+ let A = 0;
997
+ const c = [];
998
+ for (; A < 1024; )
999
+ if (n() < this._textureVoidLikelihood) {
1000
+ const f = this._textureVoidWidthMin + n() * (this._textureVoidWidthMax - this._textureVoidWidthMin);
1001
+ c.push({ type: "void", x: A, width: f }), A += f;
1002
+ } else {
1003
+ const f = 50 + n() * 200;
1004
+ c.push({ type: "matter", x: A, width: f }), A += f;
1005
+ }
1006
+ for (const s of c)
1007
+ if (s.type === "matter") {
1008
+ const f = s.x, _ = Math.min(s.x + s.width, 1024);
1009
+ let d = f;
1010
+ for (; d < _; ) {
1011
+ const z = (2 + n() * 20) / this._textureBandDensity, C = Math.floor(n() * 1024);
1012
+ g.drawImage(
1013
+ o,
1014
+ C,
1015
+ 0,
1016
+ z,
1017
+ 1024,
1018
+ d,
1019
+ 0,
1020
+ z,
1021
+ 1024
1022
+ ), d += z;
1023
+ }
1024
+ }
1025
+ const l = e.createTexture();
1026
+ e.bindTexture(e.TEXTURE_2D, l), e.texImage2D(e.TEXTURE_2D, 0, e.RGBA, e.RGBA, e.UNSIGNED_BYTE, E), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_WRAP_S, e.REPEAT), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_WRAP_T, e.REPEAT), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MIN_FILTER, e.LINEAR_MIPMAP_LINEAR), e.texParameteri(e.TEXTURE_2D, e.TEXTURE_MAG_FILTER, e.LINEAR), e.generateMipmap(e.TEXTURE_2D);
1027
+ const m = e.getExtension("EXT_texture_filter_anisotropic") || e.getExtension("MOZ_EXT_texture_filter_anisotropic") || e.getExtension("WEBKIT_EXT_texture_filter_anisotropic");
1028
+ if (m) {
1029
+ const s = e.getParameter(m.MAX_TEXTURE_MAX_ANISOTROPY_EXT);
1030
+ e.texParameterf(e.TEXTURE_2D, m.TEXTURE_MAX_ANISOTROPY_EXT, Math.min(16, s));
1031
+ }
1032
+ return l;
1033
+ }
998
1034
  }
999
- `, W), J = (r) => {
1000
- r.id = Q, r.href = "https://neat.firecms.co", r.target = "_blank", r.style.position = "absolute", r.style.display = "block", r.style.bottom = "0", r.style.right = "0", r.style.padding = "10px", r.style.color = "#dcdcdc", r.style.opacity = "0.8", r.style.fontFamily = "sans-serif", r.style.fontSize = "16px", r.style.fontWeight = "bold", r.style.textDecoration = "none", r.style.zIndex = "10000", r.innerHTML = "NEAT";
1001
- }, Pe = (r) => {
1002
- const e = r.parentElement?.getElementsByTagName("a");
1003
- if (e) {
1004
- for (let t = 0; t < e.length; t++)
1005
- if (e[t].id === Q)
1006
- return J(e[t]), e[t];
1007
- }
1008
- const s = document.createElement("a");
1009
- return J(s), r.parentElement?.appendChild(s), s;
1035
+ const Z = (a) => {
1036
+ a.id = ye, a.href = "https://neat.firecms.co", a.target = "_blank", a.style.position = "absolute", a.style.display = "block", a.style.bottom = "0", a.style.right = "0", a.style.padding = "10px", a.style.color = "#dcdcdc", a.style.opacity = "0.8", a.style.fontFamily = "sans-serif", a.style.fontSize = "16px", a.style.fontWeight = "bold", a.style.textDecoration = "none", a.style.zIndex = "10000", a.style.pointerEvents = "auto", a.setAttribute("data-n", "1"), a.innerHTML = "NEAT";
1037
+ }, ve = (a) => {
1038
+ const e = a.parentElement;
1039
+ if (e && getComputedStyle(e).position === "static" && (e.style.position = "relative"), e) {
1040
+ const o = e.querySelector("a[data-n]");
1041
+ if (o)
1042
+ return Z(o), o;
1043
+ }
1044
+ const i = document.createElement("a");
1045
+ return Z(i), e?.appendChild(i), i;
1010
1046
  };
1011
- function Oe() {
1012
- const r = new Date(), e = r.getMinutes(), s = r.getSeconds();
1013
- return e * 60 + s;
1047
+ function we() {
1048
+ const a = new Date(), e = a.getMinutes(), i = a.getSeconds();
1049
+ return e * 60 + i;
1014
1050
  }
1015
- function Te(r = 6) {
1051
+ function Se(a = 6) {
1016
1052
  const e = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
1017
- let s = "";
1018
- for (let t = 0; t < r; t++) {
1019
- const f = Math.floor(Math.random() * e.length);
1020
- s += e.charAt(f);
1053
+ let i = "";
1054
+ for (let o = 0; o < a; o++) {
1055
+ const t = Math.floor(Math.random() * e.length);
1056
+ i += e.charAt(t);
1021
1057
  }
1022
- return s;
1058
+ return i;
1023
1059
  }
1024
- function Fe(r, e) {
1025
- const s = document.createElement("a");
1026
- s.download = e, s.href = r, document.body.appendChild(s), s.click(), document.body.removeChild(s);
1060
+ function be(a, e) {
1061
+ const i = document.createElement("a");
1062
+ i.download = e, i.href = a, document.body.appendChild(i), i.click(), document.body.removeChild(i);
1063
+ }
1064
+ function Ee() {
1065
+ if (document.getElementById("neat-seo-schema"))
1066
+ return;
1067
+ const a = document.createElement("script");
1068
+ a.id = "neat-seo-schema", a.type = "application/ld+json", a.text = JSON.stringify({
1069
+ "@context": "https://schema.org",
1070
+ "@type": "WebSite",
1071
+ name: "NEAT Gradient",
1072
+ url: "https://neat.firecms.co",
1073
+ author: {
1074
+ "@type": "Organization",
1075
+ name: "FireCMS",
1076
+ url: "https://firecms.co"
1077
+ },
1078
+ description: "Beautiful, fast, heavily customizable, WebGL based gradients."
1079
+ }), document.head.appendChild(a);
1080
+ const e = document.createElement("div");
1081
+ e.style.position = "absolute", e.style.width = "1px", e.style.height = "1px", e.style.padding = "0", e.style.margin = "-1px", e.style.overflow = "hidden", e.style.clip = "rect(0, 0, 0, 0)", e.style.whiteSpace = "nowrap", e.style.borderWidth = "0";
1082
+ try {
1083
+ const i = e.attachShadow({ mode: "closed" }), o = document.createElement("a");
1084
+ o.href = "https://firecms.co", o.textContent = "FireCMS", i.appendChild(o);
1085
+ } catch {
1086
+ const o = document.createElement("a");
1087
+ o.href = "https://firecms.co", o.textContent = "FireCMS", e.appendChild(o);
1088
+ }
1089
+ document.body.appendChild(e);
1027
1090
  }
1028
1091
  export {
1029
- Be as NeatGradient
1092
+ Te as NeatGradient
1030
1093
  };
1031
1094
  //# sourceMappingURL=index.es.js.map