image-color-grading 1.0.2 → 1.0.4
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/README.md +181 -40
- package/dist/index.cjs +1 -1
- package/dist/index.d.cts +179 -8
- package/dist/index.d.ts +179 -8
- package/dist/index.js +1 -1
- package/package.json +6 -2
package/README.md
CHANGED
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
# image-color-grading
|
|
2
2
|
|
|
3
|
-
基于 WebGL 的高性能图像调色库,支持 22+ 种专业级调色参数,可用于图像编辑、滤镜应用等场景。
|
|
3
|
+
基于 WebGL/WebGPU 的高性能图像调色库,支持 22+ 种专业级调色参数,可用于图像编辑、滤镜应用等场景。
|
|
4
4
|
|
|
5
5
|
## 特性
|
|
6
6
|
|
|
7
|
-
- 🚀 **高性能** - 基于 WebGL 的 GPU 加速渲染
|
|
7
|
+
- 🚀 **高性能** - 基于 WebGL/WebGPU 的 GPU 加速渲染
|
|
8
|
+
- 🔄 **双后端支持** - 支持 WebGPU(更高性能)和 WebGL(更广兼容性),自动降级
|
|
8
9
|
- 🎨 **丰富的调色参数** - 支持 22+ 种专业调色参数
|
|
9
10
|
- 📦 **零依赖** - 无任何第三方依赖
|
|
10
11
|
- 🔧 **易于使用** - 简洁的 API 设计
|
|
@@ -30,9 +31,13 @@ pnpm add image-color-grading
|
|
|
30
31
|
```typescript
|
|
31
32
|
import { ImageColorGrading } from 'image-color-grading';
|
|
32
33
|
|
|
33
|
-
//
|
|
34
|
+
// 创建处理器实例(自动选择最佳后端,优先 WebGPU)
|
|
34
35
|
const processor = new ImageColorGrading();
|
|
35
36
|
|
|
37
|
+
// 或指定后端
|
|
38
|
+
const gpuProcessor = new ImageColorGrading({ backend: 'webgpu' });
|
|
39
|
+
const glProcessor = new ImageColorGrading({ backend: 'webgl' });
|
|
40
|
+
|
|
36
41
|
// 加载图像
|
|
37
42
|
await processor.loadImage('path/to/image.jpg');
|
|
38
43
|
|
|
@@ -44,6 +49,9 @@ processor.setSettings({
|
|
|
44
49
|
vibrance: 25,
|
|
45
50
|
});
|
|
46
51
|
|
|
52
|
+
// 检查当前使用的后端
|
|
53
|
+
console.log(processor.getBackendType()); // 'webgl' | 'webgpu'
|
|
54
|
+
|
|
47
55
|
// 导出为 Data URL
|
|
48
56
|
const dataUrl = processor.toDataURL();
|
|
49
57
|
|
|
@@ -51,6 +59,26 @@ const dataUrl = processor.toDataURL();
|
|
|
51
59
|
const blob = await processor.toBlob({ format: 'image/jpeg', quality: 0.9 });
|
|
52
60
|
```
|
|
53
61
|
|
|
62
|
+
### 使用自动修复
|
|
63
|
+
|
|
64
|
+
```typescript
|
|
65
|
+
// 自动分析图像并优化
|
|
66
|
+
const settings = processor.autoFix();
|
|
67
|
+
console.log(settings); // 返回应用的设置参数
|
|
68
|
+
```
|
|
69
|
+
|
|
70
|
+
### 使用预设滤镜
|
|
71
|
+
|
|
72
|
+
```typescript
|
|
73
|
+
// 应用预设滤镜
|
|
74
|
+
processor.applyPreset('pop'); // 流行风格
|
|
75
|
+
processor.applyPreset('vintage'); // 复古风格
|
|
76
|
+
processor.applyPreset('cinematic'); // 电影风格
|
|
77
|
+
processor.applyPreset('blackAndWhite'); // 黑白
|
|
78
|
+
processor.applyPreset('vivid'); // 鲜艳
|
|
79
|
+
processor.applyPreset('auto'); // 自动优化(等同于 autoFix)
|
|
80
|
+
```
|
|
81
|
+
|
|
54
82
|
## API 文档
|
|
55
83
|
|
|
56
84
|
### ImageColorGrading
|
|
@@ -60,10 +88,22 @@ const blob = await processor.toBlob({ format: 'image/jpeg', quality: 0.9 });
|
|
|
60
88
|
#### 构造函数
|
|
61
89
|
|
|
62
90
|
```typescript
|
|
63
|
-
const processor = new ImageColorGrading(
|
|
91
|
+
const processor = new ImageColorGrading(options?: ProcessorOptions);
|
|
64
92
|
```
|
|
65
93
|
|
|
66
|
-
|
|
94
|
+
**ProcessorOptions:**
|
|
95
|
+
|
|
96
|
+
| 参数 | 类型 | 默认值 | 说明 |
|
|
97
|
+
|------|------|--------|------|
|
|
98
|
+
| `canvas` | `HTMLCanvasElement` | - | 自定义 canvas 元素 |
|
|
99
|
+
| `backend` | `'auto' \| 'webgpu' \| 'webgl'` | `'auto'` | 后端选择,auto 优先使用 WebGPU |
|
|
100
|
+
|
|
101
|
+
```typescript
|
|
102
|
+
// 示例
|
|
103
|
+
const processor = new ImageColorGrading({
|
|
104
|
+
backend: 'webgpu',
|
|
105
|
+
});
|
|
106
|
+
```
|
|
67
107
|
|
|
68
108
|
#### 方法
|
|
69
109
|
|
|
@@ -216,6 +256,86 @@ if (processor.isLoaded()) {
|
|
|
216
256
|
processor.dispose();
|
|
217
257
|
```
|
|
218
258
|
|
|
259
|
+
##### autoFix(): ColorGradingSettings
|
|
260
|
+
|
|
261
|
+
自动分析图像并优化。会根据图像的色阶分布和鲜艳度自动调整参数。
|
|
262
|
+
|
|
263
|
+
```typescript
|
|
264
|
+
const settings = processor.autoFix();
|
|
265
|
+
// settings 包含自动计算的 whites、blacks、vibrance 等参数
|
|
266
|
+
```
|
|
267
|
+
|
|
268
|
+
**工作原理:**
|
|
269
|
+
1. 分析图像的直方图,找出有效的黑白色阶范围
|
|
270
|
+
2. 根据色阶范围自动调整 `whites` 和 `blacks` 参数
|
|
271
|
+
3. 分析图像的平均鲜艳度,如果不够鲜艳则自动增加 `vibrance`
|
|
272
|
+
|
|
273
|
+
##### applyPreset(preset: PresetType): ColorGradingSettings
|
|
274
|
+
|
|
275
|
+
应用预设滤镜效果。
|
|
276
|
+
|
|
277
|
+
```typescript
|
|
278
|
+
// 应用流行风格
|
|
279
|
+
const settings = processor.applyPreset('pop');
|
|
280
|
+
|
|
281
|
+
// 应用黑白效果
|
|
282
|
+
processor.applyPreset('blackAndWhite');
|
|
283
|
+
```
|
|
284
|
+
|
|
285
|
+
**可用预设:**
|
|
286
|
+
|
|
287
|
+
| 预设名 | 说明 | 主要参数 |
|
|
288
|
+
|--------|------|----------|
|
|
289
|
+
| `auto` | 自动优化 | 根据图像分析自动调整 |
|
|
290
|
+
| `blackAndWhite` | 黑白 | 去色 + 对比度增强 |
|
|
291
|
+
| `pop` | 流行 | 高对比 + 高饱和 |
|
|
292
|
+
| `vintage` | 复古 | 褪色 + 暖色调 + 颗粒 |
|
|
293
|
+
| `vivid` | 鲜艳 | 高饱和 + 高清晰度 |
|
|
294
|
+
| `cinematic` | 电影 | 高对比 + 冷色调 + 暗角 |
|
|
295
|
+
|
|
296
|
+
### 图像分析函数
|
|
297
|
+
|
|
298
|
+
库还导出了独立的图像分析函数,可用于自定义分析逻辑。
|
|
299
|
+
|
|
300
|
+
##### analyzeImageLevels(imageData: ImageData): ImageLevels
|
|
301
|
+
|
|
302
|
+
分析图像的色阶分布。
|
|
303
|
+
|
|
304
|
+
```typescript
|
|
305
|
+
import { analyzeImageLevels } from 'image-color-grading';
|
|
306
|
+
|
|
307
|
+
const canvas = document.querySelector('canvas');
|
|
308
|
+
const ctx = canvas.getContext('2d');
|
|
309
|
+
const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
|
|
310
|
+
|
|
311
|
+
const levels = analyzeImageLevels(imageData);
|
|
312
|
+
console.log(levels.black); // 最暗有效像素值 (0-100)
|
|
313
|
+
console.log(levels.white); // 最亮有效像素值 (155-255)
|
|
314
|
+
```
|
|
315
|
+
|
|
316
|
+
##### analyzeImageVibrance(imageData: ImageData): number
|
|
317
|
+
|
|
318
|
+
分析图像的鲜艳度。
|
|
319
|
+
|
|
320
|
+
```typescript
|
|
321
|
+
import { analyzeImageVibrance } from 'image-color-grading';
|
|
322
|
+
|
|
323
|
+
const vibrance = analyzeImageVibrance(imageData);
|
|
324
|
+
console.log(vibrance); // 0-1 之间,值越高越鲜艳
|
|
325
|
+
```
|
|
326
|
+
|
|
327
|
+
##### analyzeImage(imageData: ImageData): ImageAnalysis
|
|
328
|
+
|
|
329
|
+
综合分析图像(包含色阶和鲜艳度)。
|
|
330
|
+
|
|
331
|
+
```typescript
|
|
332
|
+
import { analyzeImage } from 'image-color-grading';
|
|
333
|
+
|
|
334
|
+
const analysis = analyzeImage(imageData);
|
|
335
|
+
console.log(analysis.levels); // { black, white }
|
|
336
|
+
console.log(analysis.vibrance); // 0-1
|
|
337
|
+
```
|
|
338
|
+
|
|
219
339
|
### 调色参数
|
|
220
340
|
|
|
221
341
|
所有参数的默认值为 `0`。
|
|
@@ -280,6 +400,21 @@ interface ExportOptions {
|
|
|
280
400
|
format?: 'image/png' | 'image/jpeg' | 'image/webp';
|
|
281
401
|
quality?: number; // 0-1, 仅对 jpeg/webp 有效
|
|
282
402
|
}
|
|
403
|
+
|
|
404
|
+
// 预设滤镜类型
|
|
405
|
+
type PresetType = 'auto' | 'blackAndWhite' | 'pop' | 'vintage' | 'vivid' | 'cinematic';
|
|
406
|
+
|
|
407
|
+
// 图像色阶分析结果
|
|
408
|
+
interface ImageLevels {
|
|
409
|
+
black: number; // 最暗有效像素值 (0-100)
|
|
410
|
+
white: number; // 最亮有效像素值 (155-255)
|
|
411
|
+
}
|
|
412
|
+
|
|
413
|
+
// 图像分析结果
|
|
414
|
+
interface ImageAnalysis {
|
|
415
|
+
levels: ImageLevels;
|
|
416
|
+
vibrance: number; // 0-1
|
|
417
|
+
}
|
|
283
418
|
```
|
|
284
419
|
|
|
285
420
|
## 示例
|
|
@@ -392,43 +527,49 @@ async function batchProcess(imageUrls: string[], settings: Partial<ColorGradingS
|
|
|
392
527
|
}
|
|
393
528
|
```
|
|
394
529
|
|
|
395
|
-
###
|
|
530
|
+
### 使用内置预设滤镜
|
|
396
531
|
|
|
397
532
|
```typescript
|
|
398
|
-
import { ImageColorGrading,
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
//
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
533
|
+
import { ImageColorGrading, presets } from 'image-color-grading';
|
|
534
|
+
|
|
535
|
+
const processor = new ImageColorGrading();
|
|
536
|
+
await processor.loadImage('/sample.jpg');
|
|
537
|
+
|
|
538
|
+
// 方式1:使用 applyPreset 方法
|
|
539
|
+
processor.applyPreset('pop');
|
|
540
|
+
|
|
541
|
+
// 方式2:直接使用 presets 配置
|
|
542
|
+
console.log(presets.pop);
|
|
543
|
+
// { highlights: 50, shadows: -50, vibrance: 50, saturation: 20, exposure: 20, clarity: 20 }
|
|
544
|
+
|
|
545
|
+
// 自定义预设(基于内置预设扩展)
|
|
546
|
+
processor.setSettings({
|
|
547
|
+
...presets.vintage,
|
|
548
|
+
grain: 50, // 增加颗粒感
|
|
549
|
+
});
|
|
550
|
+
```
|
|
551
|
+
|
|
552
|
+
### 自动修复示例
|
|
553
|
+
|
|
554
|
+
```typescript
|
|
555
|
+
import { ImageColorGrading, analyzeImage } from 'image-color-grading';
|
|
556
|
+
|
|
557
|
+
const processor = new ImageColorGrading();
|
|
558
|
+
await processor.loadImage('/photo.jpg');
|
|
559
|
+
|
|
560
|
+
// 方式1:一键自动修复
|
|
561
|
+
processor.autoFix();
|
|
562
|
+
|
|
563
|
+
// 方式2:手动分析并自定义调整
|
|
564
|
+
const imageData = processor.getImageData();
|
|
565
|
+
const analysis = analyzeImage(imageData);
|
|
566
|
+
|
|
567
|
+
if (analysis.vibrance < 0.5) {
|
|
568
|
+
// 图像非常暗淡,需要更强的增强
|
|
569
|
+
processor.setSettings({
|
|
570
|
+
vibrance: 60,
|
|
571
|
+
saturation: 30,
|
|
572
|
+
});
|
|
432
573
|
}
|
|
433
574
|
```
|
|
434
575
|
|
package/dist/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
var e="\nprecision highp float;\nattribute vec2 aPosition;\nattribute vec2 aTexCoord;\nvarying vec2 vUv;\nvoid main() {\n vUv = aTexCoord;\n gl_Position = vec4(aPosition, 0.0, 1.0);\n}\n",n="\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform vec2 uTexel;\nuniform float uKernel[9];\nuniform float uAmount;\nvoid main(void) {\n vec4 c11 = texture2D(uTexture, vUv - uTexel);\n vec4 c12 = texture2D(uTexture, vec2(vUv.x, vUv.y - uTexel.y));\n vec4 c13 = texture2D(uTexture, vec2(vUv.x + uTexel.x, vUv.y - uTexel.y));\n vec4 c21 = texture2D(uTexture, vec2(vUv.x - uTexel.x, vUv.y));\n vec4 c22 = texture2D(uTexture, vUv);\n vec4 c23 = texture2D(uTexture, vec2(vUv.x + uTexel.x, vUv.y));\n vec4 c31 = texture2D(uTexture, vec2(vUv.x - uTexel.x, vUv.y + uTexel.y));\n vec4 c32 = texture2D(uTexture, vec2(vUv.x, vUv.y + uTexel.y));\n vec4 c33 = texture2D(uTexture, vUv + uTexel);\n vec4 color = c11 * uKernel[0] + c12 * uKernel[1] + c13 * uKernel[2] +\n c21 * uKernel[3] + c22 * uKernel[4] + c23 * uKernel[5] +\n c31 * uKernel[6] + c32 * uKernel[7] + c33 * uKernel[8];\n gl_FragColor = color * uAmount + (c22 * (1.0 - uAmount));\n}\n";function t(e,n,t){const r=e.createShader(n);return r?(e.shaderSource(r,t),e.compileShader(r),e.getShaderParameter(r,e.COMPILE_STATUS)?r:(e.deleteShader(r),null)):null}function r(e,n,r,o){const a=t(e,e.VERTEX_SHADER,n),i=t(e,e.FRAGMENT_SHADER,r);if(!a||!i)throw new Error("Shader compile failed.");const c=function(e,n,t){const r=e.createProgram();return r?(e.attachShader(r,n),e.attachShader(r,t),e.linkProgram(r),e.getProgramParameter(r,e.LINK_STATUS)?r:(e.deleteProgram(r),null)):null}(e,a,i);if(!c)throw new Error("Program link failed.");const u={aPosition:e.getAttribLocation(c,"aPosition"),aTexCoord:e.getAttribLocation(c,"aTexCoord"),apos:e.getAttribLocation(c,"apos"),auv:e.getAttribLocation(c,"auv")},l={};return o.forEach(n=>{l[n]=e.getUniformLocation(c,n)}),{program:c,attribs:u,uniforms:l}}function o(e,n,t){const r=e.createTexture();if(!r)throw new Error("Unable to create texture");e.bindTexture(e.TEXTURE_2D,r),e.texImage2D(e.TEXTURE_2D,0,e.RGBA,n,t,0,e.RGBA,e.UNSIGNED_BYTE,null),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_S,e.CLAMP_TO_EDGE),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_T,e.CLAMP_TO_EDGE);const o=e.createFramebuffer();if(!o)throw new Error("Unable to create framebuffer");return e.bindFramebuffer(e.FRAMEBUFFER,o),e.framebufferTexture2D(e.FRAMEBUFFER,e.COLOR_ATTACHMENT0,e.TEXTURE_2D,r,0),{framebuffer:o,texture:r}}var a=e=>Math.min(1,Math.max(0,e)),i=(e,n,t,r,o)=>{const a=1-e;return a*a*a*n+3*a*a*e*t+3*a*e*e*r+e*e*e*o},c=e=>{const n=Math.max(-100,Math.min(100,e))/100;return(e=>{const n=new Uint8Array(768);for(let t=0;t<256;t+=1){const r=i(t/255,0,e,.66,1),o=Math.round(255*a(r)),c=3*t;n[c]=o,n[c+1]=o,n[c+2]=o}return n})(a(.33-.35*n))},u={vibrance:0,saturation:0,temperature:0,tint:0,hue:0,brightness:0,exposure:0,contrast:0,blacks:0,whites:0,highlights:0,shadows:0,dehaze:0,bloom:0,glamour:0,clarity:0,sharpen:0,smooth:0,blur:0,vignette:0,grain:0},l={auto:{},blackAndWhite:{saturation:-100,contrast:20,exposure:10,clarity:10},pop:{highlights:50,shadows:-50,vibrance:50,saturation:20,exposure:20,clarity:20},vintage:{saturation:-20,contrast:10,temperature:15,grain:30,vignette:25},vivid:{vibrance:40,saturation:20,contrast:15,clarity:20},cinematic:{contrast:25,highlights:-20,shadows:15,temperature:-10,vignette:30}};function s(e){const{data:n,width:t,height:r}=e,o=new Array(256).fill(0);for(let e=0;e<n.length;e+=4)o[n[e]]+=1,o[n[e+1]]+=1,o[n[e+2]]+=1;const a=Math.round(t*r/1e3);let i=0;for(let e=0;e<256;e++)if(o[e]>a){i=e;break}let c=255;for(let e=255;e>=0;e--)if(o[e]>a){c=e;break}return i>100&&(i=100),c<155&&(c=155),{black:i,white:c}}function v(e){const{data:n,width:t,height:r}=e;let o=1,a=1;for(let e=0;e<n.length;e+=4){const t=n[e],r=n[e+1],i=n[e+2],c=Math.min(t,r,i),u=Math.max(t,r,i);a+=u/255;const l=u-c;l>0&&(o+=l/u)}return(o+a)/(t*r*2)}function m(e){return{levels:s(e),vibrance:v(e)}}exports.ImageColorGrading=class{constructor(e){this.resources=null,this.settings={...u},this.imageLoaded=!1,this.canvas=e||document.createElement("canvas")}getCanvas(){return this.canvas}getSettings(){return{...this.settings}}setSettings(e){this.settings={...this.settings,...e},this.resources&&this.render()}resetSettings(){this.settings={...u},this.resources&&this.render()}loadImage(e){return new Promise((n,t)=>{const r=new Image;r.crossOrigin="anonymous",r.onload=()=>{this.initFromImage(r),n()},r.onerror=()=>{t(new Error(`Failed to load image: ${e}`))},r.src=e})}loadFromImage(e){this.initFromImage(e)}loadFromFile(e){return new Promise((n,t)=>{const r=URL.createObjectURL(e);this.loadImage(r).then(()=>{URL.revokeObjectURL(r),n()}).catch(e=>{URL.revokeObjectURL(r),t(e)})})}loadFromImageData(e){const{width:n,height:t,data:r}=e;this.canvas.width=n,this.canvas.height=t;const o=this.getWebGLContext();if(!o)throw new Error("WebGL not supported");this.disposeResources(),o.viewport(0,0,n,t),o.pixelStorei(o.UNPACK_FLIP_Y_WEBGL,1);const a=o.createTexture();if(!a)throw new Error("Failed to create texture");o.bindTexture(o.TEXTURE_2D,a),o.texImage2D(o.TEXTURE_2D,0,o.RGBA,n,t,0,o.RGBA,o.UNSIGNED_BYTE,r),o.texParameteri(o.TEXTURE_2D,o.TEXTURE_MIN_FILTER,o.LINEAR),o.texParameteri(o.TEXTURE_2D,o.TEXTURE_MAG_FILTER,o.LINEAR),o.texParameteri(o.TEXTURE_2D,o.TEXTURE_WRAP_S,o.CLAMP_TO_EDGE),o.texParameteri(o.TEXTURE_2D,o.TEXTURE_WRAP_T,o.CLAMP_TO_EDGE),this.initResources(o,n,t,a)}render(){this.resources&&this.drawFrame(this.resources,this.settings)}toDataURL(e){const n=e?.format||"image/png",t=e?.quality;return this.canvas.toDataURL(n,t)}toBlob(e){return new Promise((n,t)=>{const r=e?.format||"image/png",o=e?.quality;this.canvas.toBlob(e=>{e?n(e):t(new Error("Failed to create blob"))},r,o)})}getImageData(){const e=this.canvas.getContext("2d");if(e)return e.getImageData(0,0,this.canvas.width,this.canvas.height);const n=this.canvas.getContext("webgl");if(n){const e=new Uint8ClampedArray(this.canvas.width*this.canvas.height*4);return n.readPixels(0,0,this.canvas.width,this.canvas.height,n.RGBA,n.UNSIGNED_BYTE,e),new ImageData(e,this.canvas.width,this.canvas.height)}throw new Error("Cannot get ImageData")}getSize(){return{width:this.canvas.width,height:this.canvas.height}}isLoaded(){return this.imageLoaded}dispose(){this.disposeResources(),this.imageLoaded=!1}analyze(){if(!this.imageLoaded)throw new Error("No image loaded");const e={...this.settings};this.settings={...u},this.render();const n=m(this.getImageData());return this.settings=e,this.render(),n}autoFix(){if(!this.imageLoaded)throw new Error("No image loaded");this.settings={...u},this.render();const e=this.getImageData(),n=s(e),t=v(e),r={...u};if(r.whites=Math.round(255-n.white),r.blacks=Math.round(n.black),t<.7){const e=Math.round(100*(.7-t));r.vibrance=Math.min(e,50)}return this.settings=r,this.render(),r}applyPreset(e){if("auto"===e)return this.autoFix();const n=l[e],t={...u,...n};return this.settings=t,this.resources&&this.render(),t}getWebGLContext(){return this.canvas.getContext("webgl",{antialias:!0,premultipliedAlpha:!1,preserveDrawingBuffer:!0})}initFromImage(e){const n=e.naturalWidth||e.width,t=e.naturalHeight||e.height;this.canvas.width=n,this.canvas.height=t;const r=this.getWebGLContext();if(!r)throw new Error("WebGL not supported");this.disposeResources(),r.disable(r.DEPTH_TEST),r.viewport(0,0,n,t),r.pixelStorei(r.UNPACK_FLIP_Y_WEBGL,1);const o=r.createTexture();if(!o)throw new Error("Failed to create texture");r.bindTexture(r.TEXTURE_2D,o),r.texImage2D(r.TEXTURE_2D,0,r.RGBA,r.RGBA,r.UNSIGNED_BYTE,e),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_MIN_FILTER,r.LINEAR),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_MAG_FILTER,r.LINEAR),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_WRAP_S,r.CLAMP_TO_EDGE),r.texParameteri(r.TEXTURE_2D,r.TEXTURE_WRAP_T,r.CLAMP_TO_EDGE),this.initResources(r,n,t,o)}initResources(t,a,i,u){const l=((e,n)=>{const t=e.createTexture();if(!t)throw new Error("Unable to create palette texture");return e.bindTexture(e.TEXTURE_2D,t),e.texImage2D(e.TEXTURE_2D,0,e.RGB,256,1,0,e.RGB,e.UNSIGNED_BYTE,n),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,e.NEAREST),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,e.NEAREST),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_S,e.CLAMP_TO_EDGE),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_T,e.CLAMP_TO_EDGE),t})(t,c(0)),s=t.createBuffer(),v=t.createBuffer();if(!s||!v)throw new Error("Failed to create buffers");t.bindBuffer(t.ARRAY_BUFFER,s),t.bufferData(t.ARRAY_BUFFER,new Float32Array([-1,-1,1,-1,-1,1,1,1]),t.STATIC_DRAW),t.bindBuffer(t.ARRAY_BUFFER,v),t.bufferData(t.ARRAY_BUFFER,new Float32Array([0,0,1,0,0,1,1,1]),t.STATIC_DRAW);const m={pass:r(t,e,"\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nvoid main() {\n gl_FragColor = texture2D(uTexture, vUv);\n}\n",["uTexture"]),vibrance:r(t,e,"\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uAmount;\nvoid main() {\n vec4 col = texture2D(uTexture, vUv);\n vec3 color = col.rgb;\n float luminance = color.r * 0.299 + color.g * 0.587 + color.b * 0.114;\n float mn = min(min(color.r, color.g), color.b);\n float mx = max(max(color.r, color.g), color.b);\n float sat = (1.0 - (mx - mn)) * (1.0 - mx) * luminance * 5.0;\n vec3 lightness = vec3((mn + mx) / 2.0);\n color = mix(color, mix(color, lightness, -uAmount), sat);\n gl_FragColor = vec4(\n mix(color, lightness, (1.0 - lightness) * (1.0 - uAmount) / 2.0 * abs(uAmount)),\n col.a\n );\n}\n",["uTexture","uAmount"]),saturation:r(t,e,"\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uMatrix[20];\nvoid main(void) {\n vec4 c = texture2D(uTexture, vUv);\n gl_FragColor.r = uMatrix[0] * c.r + uMatrix[1] * c.g + uMatrix[2] * c.b + uMatrix[3] * c.a + uMatrix[4];\n gl_FragColor.g = uMatrix[5] * c.r + uMatrix[6] * c.g + uMatrix[7] * c.b + uMatrix[8] * c.a + uMatrix[9];\n gl_FragColor.b = uMatrix[10] * c.r + uMatrix[11] * c.g + uMatrix[12] * c.b + uMatrix[13] * c.a + uMatrix[14];\n gl_FragColor.a = uMatrix[15] * c.r + uMatrix[16] * c.g + uMatrix[17] * c.b + uMatrix[18] * c.a + uMatrix[19];\n}\n",["uTexture","uMatrix[0]"]),temperature:r(t,e,"\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uAmount;\nvoid main() {\n vec4 color = texture2D(uTexture, vUv);\n color.r = clamp(color.r + uAmount, 0.0, 1.0);\n color.b = clamp(color.b - uAmount, 0.0, 1.0);\n gl_FragColor = color;\n}\n",["uTexture","uAmount"]),tint:r(t,e,"\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uAmount;\nvoid main() {\n vec4 color = texture2D(uTexture, vUv);\n color.g = clamp(color.g + uAmount, 0.0, 1.0);\n gl_FragColor = color;\n}\n",["uTexture","uAmount"]),hue:r(t,e,"\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uRotation;\nvec3 rgb2hsv(vec3 c) {\n vec4 K = vec4(0.0, -1.0 / 3.0, 2.0 / 3.0, -1.0);\n vec4 p = mix(vec4(c.bg, K.wz), vec4(c.gb, K.xy), step(c.b, c.g));\n vec4 q = mix(vec4(p.xyw, c.r), vec4(c.r, p.yzx), step(p.x, c.r));\n float d = q.x - min(q.w, q.y);\n float e = 1.0e-10;\n return vec3(abs(q.z + (q.w - q.y) / (6.0 * d + e)), d / (q.x + e), q.x);\n}\nvec3 hsv2rgb(vec3 c) {\n vec4 K = vec4(1.0, 2.0 / 3.0, 1.0 / 3.0, 3.0);\n vec3 p = abs(fract(c.xxx + K.xyz) * 6.0 - K.www);\n return c.z * mix(K.xxx, clamp(p - K.xxx, 0.0, 1.0), c.y);\n}\nvoid main() {\n lowp vec4 base = texture2D(uTexture, vUv);\n vec3 hsv = rgb2hsv(base.rgb);\n hsv.x = fract(hsv.x + uRotation);\n gl_FragColor = vec4(hsv2rgb(hsv), base.a);\n}\n",["uTexture","uRotation"]),brightness:r(t,e,"\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uAmount;\nconst float PI = 3.1415926535897932384626433832795;\nvoid main() {\n vec4 color = texture2D(uTexture, vUv);\n if (uAmount >= 0.0) {\n color.r = color.r + uAmount * sin(color.r * PI);\n color.g = color.g + uAmount * sin(color.g * PI);\n color.b = color.b + uAmount * sin(color.b * PI);\n } else {\n color.r = (1.0 + uAmount) * color.r;\n color.g = (1.0 + uAmount) * color.g;\n color.b = (1.0 + uAmount) * color.b;\n }\n gl_FragColor = color;\n}\n",["uTexture","uAmount"]),exposure:r(t,e,"\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uAmount;\nconst float epsilon = 0.000001;\nconst float mx = 1.0 - epsilon;\nconst mat3 matRGBtoROMM = mat3(\n 0.5293459296226501, 0.3300727903842926, 0.14058130979537964,\n 0.09837432950735092, 0.8734610080718994, 0.028164653107523918,\n 0.01688321679830551, 0.11767247319221497, 0.8654443025588989\n);\nconst mat3 matROMMtoRGB = mat3(\n 2.0340757369995117, -0.727334201335907, -0.3067416846752167,\n -0.22881317138671875, 1.2317301034927368, -0.0029169507324695587,\n -0.008569774217903614, -0.1532866358757019, 1.1618564128875732\n);\nfloat ramp(in float t) {\n t *= 2.0;\n if (t >= 1.0) {\n t -= 1.0;\n t = log(0.5) / log(0.5 * (1.0 - t) + 0.9332 * t);\n }\n return clamp(t, 0.001, 10.0);\n}\nvec3 rgb2hsv(in vec3 c) {\n vec4 K = vec4(0.0, -1.0 / 3.0, 2.0 / 3.0, -1.0);\n vec4 p = mix(vec4(c.bg, K.wz), vec4(c.gb, K.xy), step(c.b, c.g));\n vec4 q = mix(vec4(p.xyw, c.r), vec4(c.r, p.yzx), step(p.x, c.r));\n float d = q.x - min(q.w, q.y);\n float e = 1.0e-10;\n return vec3(abs(q.z + (q.w - q.y) / (6.0 * d + e)), d / (q.x + e), q.x);\n}\nvec3 hsv2rgb(in vec3 c) {\n vec4 K = vec4(1.0, 2.0 / 3.0, 1.0 / 3.0, 3.0);\n vec3 p = abs(fract(c.xxx + K.xyz) * 6.0 - K.www);\n return c.z * mix(K.xxx, clamp(p - K.xxx, 0.0, 1.0), c.y);\n}\nvec3 setHue(in vec3 res, in vec3 base) {\n vec3 hsv = rgb2hsv(base);\n vec3 res_hsv = rgb2hsv(res);\n return hsv2rgb(vec3(hsv.x, res_hsv.y, res_hsv.z));\n}\nvoid main() {\n lowp vec4 col = texture2D(uTexture, vUv);\n vec3 base = col.rgb * matRGBtoROMM;\n float a = abs(uAmount) * col.a + epsilon;\n float v = pow(2.0, a * 2.0 + 1.0) - 2.0;\n float m = mx - exp(-v);\n vec3 res = (uAmount > 0.0) ? (1.0 - exp(-v * base)) / m : log(1.0 - base * m) / -v;\n res = mix(base, res, min(a * 100.0, 1.0));\n res = setHue(res, base);\n res = pow(res, vec3(ramp(1.0 - (0.0 * col.a + 1.0) / 2.0)));\n res = res * matROMMtoRGB;\n gl_FragColor = vec4(res, col.a);\n}\n",["uTexture","uAmount"]),contrast:r(t,e,"\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uMatrix[20];\nvoid main(void) {\n vec4 c = texture2D(uTexture, vUv);\n gl_FragColor.r = uMatrix[0] * c.r + uMatrix[1] * c.g + uMatrix[2] * c.b + uMatrix[3] * c.a + uMatrix[4];\n gl_FragColor.g = uMatrix[5] * c.r + uMatrix[6] * c.g + uMatrix[7] * c.b + uMatrix[8] * c.a + uMatrix[9];\n gl_FragColor.b = uMatrix[10] * c.r + uMatrix[11] * c.g + uMatrix[12] * c.b + uMatrix[13] * c.a + uMatrix[14];\n gl_FragColor.a = uMatrix[15] * c.r + uMatrix[16] * c.g + uMatrix[17] * c.b + uMatrix[18] * c.a + uMatrix[19];\n}\n",["uTexture","uMatrix[0]"]),blacks:r(t,"\nprecision highp float;\nattribute vec2 apos;\nattribute vec2 auv;\nvarying vec2 uv;\nuniform vec4 transform;\nvoid main(void) {\n uv = auv;\n gl_Position = vec4(\n apos.x * transform.x + transform.z,\n apos.y * transform.y + transform.w,\n 0.0,\n 1.0\n );\n}\n","\nprecision highp float;\nvarying vec2 uv;\nuniform sampler2D uTexture;\nuniform sampler2D uPaletteMap;\nvoid main() {\n lowp vec4 base = texture2D(uTexture, uv.xy);\n float r = texture2D(uPaletteMap, vec2(base.r, 0.0)).r;\n float g = texture2D(uPaletteMap, vec2(base.g, 0.0)).g;\n float b = texture2D(uPaletteMap, vec2(base.b, 0.0)).b;\n gl_FragColor = vec4(r, g, b, base.a);\n}\n",["uTexture","uPaletteMap","transform"]),whites:r(t,e,"\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uAmount;\nconst vec3 RGB2Y = vec3(0.2126, 0.7152, 0.0722);\nvoid main() {\n vec4 base = texture2D(uTexture, vUv.xy);\n vec3 color = base.rgb;\n float lum = dot(color, RGB2Y);\n float whiteMask = smoothstep(0.5, 1.0, lum);\n color += uAmount * whiteMask;\n gl_FragColor = vec4(clamp(color, 0.0, 1.0), base.a);\n}\n",["uTexture","uAmount"]),highlights:r(t,e,"\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uAmount;\nconst float epsilon = 0.000001;\nconst float mx = 1.0 - epsilon;\nconst float PI = 3.1415926535897932384626433832795;\nconst mat3 matRGBtoROMM = mat3(\n 0.5293459296226501, 0.3300727903842926, 0.14058130979537964,\n 0.09837432950735092, 0.8734610080718994, 0.028164653107523918,\n 0.01688321679830551, 0.11767247319221497, 0.8654443025588989\n);\nconst mat3 matROMMtoRGB = mat3(\n 2.0340757369995117, -0.727334201335907, -0.3067416846752167,\n -0.22881317138671875, 1.2317301034927368, -0.0029169507324695587,\n -0.008569774217903614, -0.1532866358757019, 1.1618564128875732\n);\nfloat luma_romm(in vec3 color) {\n return dot(color, vec3(0.242655, 0.755158, 0.002187));\n}\nfloat luma(in vec3 color) {\n return dot(color, vec3(0.298839, 0.586811, 0.11435));\n}\nvec3 rgb2hsv(in vec3 c) {\n vec4 K = vec4(0.0, -1.0 / 3.0, 2.0 / 3.0, -1.0);\n vec4 p = mix(vec4(c.bg, K.wz), vec4(c.gb, K.xy), step(c.b, c.g));\n vec4 q = mix(vec4(p.xyw, c.r), vec4(c.r, p.yzx), step(p.x, c.r));\n float d = q.x - min(q.w, q.y);\n float e = 1.0e-10;\n return vec3(abs(q.z + (q.w - q.y) / (6.0 * d + e)), d / (q.x + e), q.x);\n}\nvec3 hsv2rgb(in vec3 c) {\n vec4 K = vec4(1.0, 2.0 / 3.0, 1.0 / 3.0, 3.0);\n vec3 p = abs(fract(c.xxx + K.xyz) * 6.0 - K.www);\n return c.z * mix(K.xxx, clamp(p - K.xxx, 0.0, 1.0), c.y);\n}\nvec3 setHue(in vec3 res, in vec3 base) {\n vec3 hsv = rgb2hsv(base);\n vec3 res_hsv = rgb2hsv(res);\n return hsv2rgb(vec3(hsv.x, res_hsv.y, res_hsv.z));\n}\nfloat gaussian(in float x) {\n return 1.0 - exp(-PI * 2.0 * x * x);\n}\nvoid main() {\n lowp vec4 col = texture2D(uTexture, vUv);\n lowp vec3 map = col.rgb;\n vec3 base = col.rgb * matRGBtoROMM;\n float base_lum = luma(col.rgb);\n float map_lum = luma_romm(map * matRGBtoROMM);\n float exposure = mix(uAmount, 0.0, 1.0 - map_lum) * col.a;\n float a = abs(exposure) * col.a + epsilon;\n float v = pow(2.0, a + 1.0) - 2.0;\n float m = mx - exp(-v);\n vec3 res = (exposure > 0.0) ? (1.0 - exp(-v * base)) / m : log(1.0 - base * m) / -v;\n res = mix(base, res, min(a * 100.0, 1.0));\n res = setHue(res, base);\n res = res * matROMMtoRGB;\n gl_FragColor = vec4(res, col.a);\n}\n",["uTexture","uAmount"]),shadows:r(t,e,"\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uAmount;\nconst float epsilon = 0.000001;\nconst float mx = 1.0 - epsilon;\nconst float PI = 3.1415926535897932384626433832795;\nconst mat3 matRGBtoROMM = mat3(\n 0.5293459296226501, 0.3300727903842926, 0.14058130979537964,\n 0.09837432950735092, 0.8734610080718994, 0.028164653107523918,\n 0.01688321679830551, 0.11767247319221497, 0.8654443025588989\n);\nconst mat3 matROMMtoRGB = mat3(\n 2.0340757369995117, -0.727334201335907, -0.3067416846752167,\n -0.22881317138671875, 1.2317301034927368, -0.0029169507324695587,\n -0.008569774217903614, -0.1532866358757019, 1.1618564128875732\n);\nfloat luma_romm(in vec3 color) {\n return dot(color, vec3(0.242655, 0.755158, 0.002187));\n}\nfloat luma(in vec3 color) {\n return dot(color, vec3(0.298839, 0.586811, 0.11435));\n}\nvec3 rgb2hsv(in vec3 c) {\n vec4 K = vec4(0.0, -1.0 / 3.0, 2.0 / 3.0, -1.0);\n vec4 p = mix(vec4(c.bg, K.wz), vec4(c.gb, K.xy), step(c.b, c.g));\n vec4 q = mix(vec4(p.xyw, c.r), vec4(c.r, p.yzx), step(p.x, c.r));\n float d = q.x - min(q.w, q.y);\n float e = 1.0e-10;\n return vec3(abs(q.z + (q.w - q.y) / (6.0 * d + e)), d / (q.x + e), q.x);\n}\nvec3 hsv2rgb(in vec3 c) {\n vec4 K = vec4(1.0, 2.0 / 3.0, 1.0 / 3.0, 3.0);\n vec3 p = abs(fract(c.xxx + K.xyz) * 6.0 - K.www);\n return c.z * mix(K.xxx, clamp(p - K.xxx, 0.0, 1.0), c.y);\n}\nvec3 setHue(in vec3 res, in vec3 base) {\n vec3 hsv = rgb2hsv(base);\n vec3 res_hsv = rgb2hsv(res);\n return hsv2rgb(vec3(hsv.x, res_hsv.y, res_hsv.z));\n}\nfloat gaussian(in float x) {\n return 1.0 - exp(-PI * 2.0 * x * x);\n}\nvoid main() {\n lowp vec4 col = texture2D(uTexture, vUv);\n lowp vec3 map = col.rgb;\n vec3 base = col.rgb * matRGBtoROMM;\n float base_lum = luma(col.rgb);\n float map_lum = luma_romm(map * matRGBtoROMM);\n float exposure = mix(0.0, uAmount, 1.0 - map_lum) * col.a;\n float a = abs(exposure) * col.a + epsilon;\n float v = pow(2.0, a + 1.0) - 2.0;\n float m = mx - exp(-v);\n vec3 res = (exposure > 0.0) ? (1.0 - exp(-v * base)) / m : log(1.0 - base * m) / -v;\n res = mix(base, res, min(a * 100.0, 1.0));\n res = setHue(res, base);\n res = res * matROMMtoRGB;\n gl_FragColor = vec4(res, col.a);\n}\n",["uTexture","uAmount"]),dehaze:r(t,e,"\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uAmount;\nuniform vec2 uSize;\n\nfloat hazeMap(vec2 coord) {\n vec3 color = vec3(1.0);\n vec2 stepSize = vec2(1.0 / uSize.x, 1.0 / uSize.y);\n for (int i = -1; i <= 1; ++i) {\n for (int j = -1; j <= 1; ++j) {\n vec2 offset = vec2(float(i), float(j)) * stepSize;\n vec2 uv = clamp(coord + offset, 0.0, 1.0);\n vec3 sample = texture2D(uTexture, uv).rgb;\n color = min(color, sample);\n }\n }\n return min(color.r, min(color.g, color.b));\n}\n\nvoid main() {\n vec4 base = texture2D(uTexture, vUv);\n float haze = hazeMap(vUv);\n float transmission = 1.0 - 0.95 * haze;\n const float A = 0.95;\n const float t0 = 0.1;\n float t = mix(1.0, max(t0, transmission), uAmount);\n vec3 J = (base.rgb - A) / t + A;\n gl_FragColor = vec4(J, base.a);\n}\n",["uTexture","uAmount","uSize"]),bloom:r(t,e,"\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uAmount;\nuniform vec2 uTexel;\nuniform float uThreshold;\n\nvoid main() {\n vec4 sum = vec4(0.0);\n int j = -2;\n for (int i = -2; i <= 2; i++) sum += texture2D(uTexture, vUv + vec2(float(i), float(j)) * uTexel);\n j = -1;\n for (int i = -2; i <= 2; i++) sum += texture2D(uTexture, vUv + vec2(float(i), float(j)) * uTexel);\n j = 0;\n for (int i = -2; i <= 2; i++) sum += texture2D(uTexture, vUv + vec2(float(i), float(j)) * uTexel);\n j = 1;\n for (int i = -2; i <= 2; i++) sum += texture2D(uTexture, vUv + vec2(float(i), float(j)) * uTexel);\n j = 2;\n for (int i = -2; i <= 2; i++) sum += texture2D(uTexture, vUv + vec2(float(i), float(j)) * uTexel);\n sum /= 25.0;\n vec4 base = texture2D(uTexture, vUv);\n if (length(sum.rgb) > uThreshold) {\n base += sum * uAmount;\n }\n gl_FragColor = base;\n}\n",["uTexture","uAmount","uTexel","uThreshold"]),glamour:r(t,e,"\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uAmount;\nuniform vec2 uTexel;\n\nfloat normpdf(in float x, in float sigma) {\n return 0.39894 * exp(-0.5 * x * x / (sigma * sigma)) / sigma;\n}\n\nvec3 blurMap() {\n const int mSize = 11;\n const int kSize = (mSize - 1) / 2;\n float kernel[mSize];\n vec3 final_colour = vec3(0.0);\n float sigma = 7.0;\n float Z = 0.0;\n for (int j = 0; j <= kSize; ++j) {\n kernel[kSize + j] = kernel[kSize - j] = normpdf(float(j), sigma);\n }\n for (int j = 0; j < mSize; ++j) {\n Z += kernel[j];\n }\n for (int i = -kSize; i <= kSize; ++i) {\n for (int j = -kSize; j <= kSize; ++j) {\n final_colour += kernel[kSize + j] * kernel[kSize + i] *\n texture2D(uTexture, vUv + vec2(float(i), float(j)) * uTexel).rgb;\n }\n }\n return vec3(final_colour / (Z * Z));\n}\n\nfloat luma(vec3 color) {\n return dot(color, vec3(0.299, 0.587, 0.114));\n}\n\nvoid main() {\n vec4 base = texture2D(uTexture, vUv);\n vec3 color = blurMap();\n color = vec3(luma(color));\n color = vec3(\n (base.r <= 0.5) ? (2.0 * base.r * color.r) : (1.0 - 2.0 * (1.0 - base.r) * (1.0 - color.r)),\n (base.g <= 0.5) ? (2.0 * base.g * color.g) : (1.0 - 2.0 * (1.0 - base.g) * (1.0 - color.g)),\n (base.b <= 0.5) ? (2.0 * base.b * color.b) : (1.0 - 2.0 * (1.0 - base.b) * (1.0 - color.b))\n );\n gl_FragColor = mix(base, vec4(color, base.a), uAmount);\n}\n",["uTexture","uAmount","uTexel"]),clarity:r(t,e,"\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uAmount;\nuniform vec2 uTexel;\n\nfloat Lum(vec3 c) {\n return 0.299 * c.r + 0.587 * c.g + 0.114 * c.b;\n}\nfloat BlendOverlayf(float base, float blend) {\n return (base < 0.5 ? (2.0 * base * blend) : (1.0 - 2.0 * (1.0 - base) * (1.0 - blend)));\n}\nvec3 BlendOverlay(vec3 base, vec3 blend) {\n return vec3(BlendOverlayf(base.r, blend.r), BlendOverlayf(base.g, blend.g), BlendOverlayf(base.b, blend.b));\n}\nfloat BlendVividLightf(float base, float blend) {\n float BlendColorBurnf = (((2.0 * blend) == 0.0) ? (2.0 * blend) : max((1.0 - ((1.0 - base) / (2.0 * blend))), 0.0));\n float BlendColorDodgef = (((2.0 * (blend - 0.5)) == 1.0) ? (2.0 * (blend - 0.5)) : min(base / (1.0 - (2.0 * (blend - 0.5))), 1.0));\n return ((blend < 0.5) ? BlendColorBurnf : BlendColorDodgef);\n}\nvec3 BlendVividLight(vec3 base, vec3 blend) {\n return vec3(BlendVividLightf(base.r, blend.r), BlendVividLightf(base.g, blend.g), BlendVividLightf(base.b, blend.b));\n}\nfloat normpdf(in float x, in float sigma) {\n return 0.39894 * exp(-0.5 * x * x / (sigma * sigma)) / sigma;\n}\nvec3 blurMap() {\n const int mSize = 11;\n const int kSize = (mSize - 1) / 2;\n float kernel[mSize];\n vec3 final_colour = vec3(0.0);\n float sigma = 7.0;\n float Z = 0.0;\n for (int j = 0; j <= kSize; ++j) {\n kernel[kSize + j] = kernel[kSize - j] = normpdf(float(j), sigma);\n }\n for (int j = 0; j < mSize; ++j) {\n Z += kernel[j];\n }\n for (int i = -kSize; i <= kSize; ++i) {\n for (int j = -kSize; j <= kSize; ++j) {\n final_colour += kernel[kSize + j] * kernel[kSize + i] *\n texture2D(uTexture, vUv + vec2(float(i), float(j)) * uTexel).rgb;\n }\n }\n return vec3(final_colour / (Z * Z));\n}\nvoid main() {\n vec4 base4 = texture2D(uTexture, vUv);\n vec3 blur = blurMap();\n vec3 base = base4.rgb;\n float intensity = (uAmount < 0.0) ? (uAmount / 2.0) : uAmount;\n float lum = Lum(base);\n vec3 col = vec3(lum);\n vec3 mask = vec3(1.0 - pow(lum, 1.8));\n vec3 layer = vec3(1.0 - Lum(blur));\n vec3 detail = clamp(BlendVividLight(col, layer), 0.0, 1.0);\n vec3 inverse = mix(1.0 - detail, detail, (intensity + 1.0) / 2.0);\n gl_FragColor = vec4(BlendOverlay(base, mix(vec3(0.5), inverse, mask)), base4.a);\n}\n",["uTexture","uAmount","uTexel"]),sharpen:r(t,e,n,["uTexture","uTexel","uKernel[0]","uAmount"]),smooth:r(t,e,n,["uTexture","uTexel","uKernel[0]","uAmount"]),blur:r(t,e,"\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform vec2 uSize;\nfloat random(vec3 scale, float seed) {\n return fract(sin(dot(gl_FragCoord.xyz + seed, scale)) * 43758.5453 + seed);\n}\nvoid main() {\n vec4 color = vec4(0.0);\n float total = 0.0;\n float offset = random(vec3(12.9898, 78.233, 151.7182), 0.0);\n for (int t = -30; t <= 30; t++) {\n float percent = (float(t) + offset - 0.5) / 30.0;\n float weight = 1.0 - abs(percent);\n vec4 sample = texture2D(uTexture, vUv + uSize * percent);\n sample.rgb *= sample.a;\n color += sample * weight;\n total += weight;\n }\n gl_FragColor = color / total;\n gl_FragColor.rgb /= gl_FragColor.a + 0.00001;\n}\n",["uTexture","uSize"]),vignette:r(t,e,"\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uAmount;\nuniform float uSize;\nvoid main() {\n vec4 color = texture2D(uTexture, vUv);\n float dist = distance(vUv, vec2(0.5, 0.5));\n float amt = clamp(uAmount, -1.0, 1.0);\n float edge = dist * (abs(amt) * 0.75 + uSize * 2.0);\n float vignette = smoothstep(0.8, uSize * 0.799, edge);\n if (amt < 0.0) {\n vignette = 1.0 + (1.0 - vignette) * (-amt);\n } else {\n vignette = mix(1.0, vignette, amt);\n }\n color.rgb *= vignette;\n gl_FragColor = color;\n}\n",["uTexture","uAmount","uSize"]),grain:r(t,e,"\nprecision highp float;\nuniform sampler2D uTexture;\nvarying vec2 vUv;\nuniform vec2 uResolution;\nuniform float uAmount;\nuniform float uTime;\nconst float permTexUnit = 1.0 / 256.0;\nconst float permTexUnitHalf = 0.5 / 256.0;\nfloat grainsize = 1.8;\nfloat lumamount = 1.0;\n\nvec4 rnm(in vec2 tc) {\n float noise = sin(dot(tc + vec2(uTime, uTime), vec2(12.9898, 78.233))) * 43758.5453;\n float noiseR = fract(noise) * 2.0 - 1.0;\n float noiseG = fract(noise * 1.2154) * 2.0 - 1.0;\n float noiseB = fract(noise * 1.3453) * 2.0 - 1.0;\n float noiseA = fract(noise * 1.3647) * 2.0 - 1.0;\n return vec4(noiseR, noiseG, noiseB, noiseA);\n}\nfloat fade(in float t) {\n return t * t * t * (t * (t * 6.0 - 15.0) + 10.0);\n}\nfloat pnoise3D(in vec3 p) {\n vec3 pi = permTexUnit * floor(p) + permTexUnitHalf;\n vec3 pf = fract(p);\n float perm00 = rnm(pi.xy).a;\n vec3 grad000 = rnm(vec2(perm00, pi.z)).rgb * 4.0 - 1.0;\n float n000 = dot(grad000, pf);\n vec3 grad001 = rnm(vec2(perm00, pi.z + permTexUnit)).rgb * 4.0 - 1.0;\n float n001 = dot(grad001, pf - vec3(0.0, 0.0, 1.0));\n float perm01 = rnm(pi.xy + vec2(0.0, permTexUnit)).a;\n vec3 grad010 = rnm(vec2(perm01, pi.z)).rgb * 4.0 - 1.0;\n float n010 = dot(grad010, pf - vec3(0.0, 1.0, 0.0));\n vec3 grad011 = rnm(vec2(perm01, pi.z + permTexUnit)).rgb * 4.0 - 1.0;\n float n011 = dot(grad011, pf - vec3(0.0, 1.0, 1.0));\n float perm10 = rnm(pi.xy + vec2(permTexUnit, 0.0)).a;\n vec3 grad100 = rnm(vec2(perm10, pi.z)).rgb * 4.0 - 1.0;\n float n100 = dot(grad100, pf - vec3(1.0, 0.0, 0.0));\n vec3 grad101 = rnm(vec2(perm10, pi.z + permTexUnit)).rgb * 4.0 - 1.0;\n float n101 = dot(grad101, pf - vec3(1.0, 0.0, 1.0));\n float perm11 = rnm(pi.xy + vec2(permTexUnit, permTexUnit)).a;\n vec3 grad110 = rnm(vec2(perm11, pi.z)).rgb * 4.0 - 1.0;\n float n110 = dot(grad110, pf - vec3(1.0, 1.0, 0.0));\n vec3 grad111 = rnm(vec2(perm11, pi.z + permTexUnit)).rgb * 4.0 - 1.0;\n float n111 = dot(grad111, pf - vec3(1.0, 1.0, 1.0));\n vec4 n_x = mix(vec4(n000, n001, n010, n011), vec4(n100, n101, n110, n111), fade(pf.x));\n vec2 n_xy = mix(n_x.xy, n_x.zw, fade(pf.y));\n float n_xyz = mix(n_xy.x, n_xy.y, fade(pf.z));\n return n_xyz;\n}\nvec2 coordRot(in vec2 tc, in float angle) {\n float aspect = uResolution.x / uResolution.y;\n float rotX = ((tc.x * 2.0 - 1.0) * aspect * cos(angle)) - ((tc.y * 2.0 - 1.0) * sin(angle));\n float rotY = ((tc.y * 2.0 - 1.0) * cos(angle)) + ((tc.x * 2.0 - 1.0) * aspect * sin(angle));\n rotX = ((rotX / aspect) * 0.5 + 0.5);\n rotY = rotY * 0.5 + 0.5;\n return vec2(rotX, rotY);\n}\nvoid main() {\n vec3 rotOffset = vec3(1.425, 3.892, 5.835);\n vec2 rotCoordsR = coordRot(vUv, uTime + rotOffset.x);\n vec3 noise = vec3(pnoise3D(vec3(rotCoordsR * vec2(uResolution.x / grainsize, uResolution.y / grainsize), 0.0)));\n vec4 tex = texture2D(uTexture, vUv);\n vec3 col = tex.rgb;\n vec3 lumcoeff = vec3(0.299, 0.587, 0.114);\n float luminance = mix(0.0, dot(col, lumcoeff), lumamount);\n float lum = smoothstep(0.2, 0.0, luminance);\n lum += luminance;\n noise = mix(noise, vec3(0.0), pow(lum, 4.0));\n col = col + noise * uAmount;\n gl_FragColor = vec4(col, tex.a);\n}\n",["uTexture","uResolution","uAmount","uTime"])},x=[o(t,a,i),o(t,a,i)];this.resources={gl:t,width:a,height:i,sourceTexture:u,blackPalette:l,quad:{positionBuffer:s,texCoordBuffer:v},programs:m,targets:x},this.imageLoaded=!0,this.render()}disposeResources(){if(!this.resources)return;const{gl:e,sourceTexture:n,blackPalette:t,quad:r,programs:o,targets:a}=this.resources;e.deleteTexture(n),e.deleteTexture(t),e.deleteBuffer(r.positionBuffer),e.deleteBuffer(r.texCoordBuffer),a.forEach(n=>{e.deleteFramebuffer(n.framebuffer),e.deleteTexture(n.texture)}),Object.values(o).forEach(n=>{e.deleteProgram(n.program)}),this.resources=null}drawFrame(e,n){const{gl:t,width:r,height:o,sourceTexture:a,blackPalette:i,quad:u,programs:l,targets:s}=e;t.viewport(0,0,r,o);const v=[1/r,1/o];let m=a,x=0;const f=(e,n,r)=>{t.useProgram(e.program),(e=>{t.bindBuffer(t.ARRAY_BUFFER,u.positionBuffer);const n=e.attribs.aPosition>=0?e.attribs.aPosition:e.attribs.apos;n>=0&&(t.enableVertexAttribArray(n),t.vertexAttribPointer(n,2,t.FLOAT,!1,0,0)),t.bindBuffer(t.ARRAY_BUFFER,u.texCoordBuffer);const r=e.attribs.aTexCoord>=0?e.attribs.aTexCoord:e.attribs.auv;r>=0&&(t.enableVertexAttribArray(r),t.vertexAttribPointer(r,2,t.FLOAT,!1,0,0))})(e),t.activeTexture(t.TEXTURE0),t.bindTexture(t.TEXTURE_2D,m);const o=e.uniforms.uTexture;o&&t.uniform1i(o,0),n(),t.bindFramebuffer(t.FRAMEBUFFER,r?r.framebuffer:null),t.drawArrays(t.TRIANGLE_STRIP,0,4),m=r?r.texture:m},g=()=>{const e=s[x%2];return x+=1,e};Math.abs(n.vibrance)>.5&&f(l.vibrance,()=>{t.uniform1f(l.vibrance.uniforms.uAmount,n.vibrance/100)},g()),Math.abs(n.saturation)>.5&&f(l.saturation,()=>{const e=(e=>{const n=1+Math.max(-100,Math.min(100,e))/100,t=.299,r=.587,o=.114,a=1-n;return new Float32Array([a*t+n,a*r,a*o,0,0,a*t,a*r+n,a*o,0,0,a*t,a*r,a*o+n,0,0,0,0,0,1,0])})(n.saturation);t.uniform1fv(l.saturation.uniforms["uMatrix[0]"],e)},g()),Math.abs(n.temperature)>.5&&f(l.temperature,()=>{t.uniform1f(l.temperature.uniforms.uAmount,n.temperature/500)},g()),Math.abs(n.tint)>.5&&f(l.tint,()=>{t.uniform1f(l.tint.uniforms.uAmount,n.tint/500)},g()),Math.abs(n.hue)>.5&&f(l.hue,()=>{t.uniform1f(l.hue.uniforms.uRotation,n.hue/200)},g()),f(l.brightness,()=>{t.uniform1f(l.brightness.uniforms.uAmount,n.brightness/200)},g()),Math.abs(n.exposure)>.5&&f(l.exposure,()=>{t.uniform1f(l.exposure.uniforms.uAmount,n.exposure/100)},g()),Math.abs(n.contrast)>.5&&f(l.contrast,()=>{const e=(e=>{const n=1+Math.max(-100,Math.min(100,e))/100,t=.5*(1-n);return new Float32Array([n,0,0,0,t,0,n,0,0,t,0,0,n,0,t,0,0,0,1,0])})(n.contrast);t.uniform1fv(l.contrast.uniforms["uMatrix[0]"],e)},g()),Math.abs(n.blacks)>.5&&(((e,n,t)=>{e.bindTexture(e.TEXTURE_2D,n),e.texSubImage2D(e.TEXTURE_2D,0,0,0,256,1,e.RGB,e.UNSIGNED_BYTE,t)})(t,i,c(n.blacks)),f(l.blacks,()=>{t.activeTexture(t.TEXTURE1),t.bindTexture(t.TEXTURE_2D,i),t.uniform1i(l.blacks.uniforms.uPaletteMap,1),t.uniform4f(l.blacks.uniforms.transform,1,1,0,0),t.activeTexture(t.TEXTURE0)},g())),Math.abs(n.whites)>.5&&f(l.whites,()=>{t.uniform1f(l.whites.uniforms.uAmount,n.whites/400)},g()),Math.abs(n.highlights)>.5&&f(l.highlights,()=>{t.uniform1f(l.highlights.uniforms.uAmount,n.highlights/100)},g()),Math.abs(n.shadows)>.5&&f(l.shadows,()=>{t.uniform1f(l.shadows.uniforms.uAmount,n.shadows/100)},g()),Math.abs(n.dehaze)>.5&&f(l.dehaze,()=>{t.uniform1f(l.dehaze.uniforms.uAmount,n.dehaze/100),t.uniform2f(l.dehaze.uniforms.uSize,r,o)},g()),n.bloom>.5&&f(l.bloom,()=>{t.uniform1f(l.bloom.uniforms.uAmount,n.bloom/100),t.uniform2f(l.bloom.uniforms.uTexel,v[0],v[1]),t.uniform1f(l.bloom.uniforms.uThreshold,.5)},g()),n.glamour>.5&&f(l.glamour,()=>{t.uniform1f(l.glamour.uniforms.uAmount,n.glamour/100),t.uniform2f(l.glamour.uniforms.uTexel,v[0],v[1])},g()),Math.abs(n.clarity)>.5&&f(l.clarity,()=>{t.uniform1f(l.clarity.uniforms.uAmount,n.clarity/100),t.uniform2f(l.clarity.uniforms.uTexel,v[0],v[1])},g()),n.sharpen>.5&&f(l.sharpen,()=>{t.uniform2f(l.sharpen.uniforms.uTexel,v[0],v[1]),t.uniform1f(l.sharpen.uniforms.uAmount,n.sharpen/100),t.uniform1fv(l.sharpen.uniforms["uKernel[0]"],new Float32Array([0,-1,0,-1,5,-1,0,-1,0]))},g()),n.smooth>.5&&f(l.smooth,()=>{t.uniform2f(l.smooth.uniforms.uTexel,v[0],v[1]),t.uniform1f(l.smooth.uniforms.uAmount,n.smooth/100),t.uniform1fv(l.smooth.uniforms["uKernel[0]"],new Float32Array([1/9,1/9,1/9,1/9,1/9,1/9,1/9,1/9,1/9]))},g());const p=n.blur;f(l.blur,()=>{t.uniform2f(l.blur.uniforms.uSize,p/r,0)},g()),f(l.blur,()=>{t.uniform2f(l.blur.uniforms.uSize,0,p/o)},g()),f(l.vignette,()=>{t.uniform1f(l.vignette.uniforms.uAmount,n.vignette/100),t.uniform1f(l.vignette.uniforms.uSize,.25)},g()),f(l.grain,()=>{t.uniform2f(l.grain.uniforms.uResolution,r,o),t.uniform1f(l.grain.uniforms.uAmount,n.grain/800),t.uniform1f(l.grain.uniforms.uTime,0)},g()),f(l.pass,()=>{},null)}},exports.analyzeImage=m,exports.analyzeImageLevels=s,exports.analyzeImageVibrance=v,exports.defaultSettings=u,exports.presets=l;
|
|
1
|
+
var e=class{constructor(e,n={}){this.width=0,this.height=0,this.initialized=!1,this.canvas=e,this.options=n}static isSupported(){return!1}getSize(){return{width:this.width,height:this.height}}isInitialized(){return this.initialized}};function n(){return"undefined"!=typeof navigator&&"gpu"in navigator}function t(){if("undefined"==typeof document)return!1;try{const e=document.createElement("canvas");return!(!e.getContext("webgl")&&!e.getContext("experimental-webgl"))}catch{return!1}}function r(e){if("webgpu"===e&&n())return"webgpu";if("webgl"===e&&t())return"webgl";if("auto"===e||void 0===e){if(n())return"webgpu";if(t())return"webgl"}throw new Error("No supported graphics backend available")}var a="\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform vec2 uTexel;\nuniform float uKernel[9];\nuniform float uAmount;\nvoid main(void) {\n vec4 c11 = texture2D(uTexture, vUv - uTexel);\n vec4 c12 = texture2D(uTexture, vec2(vUv.x, vUv.y - uTexel.y));\n vec4 c13 = texture2D(uTexture, vec2(vUv.x + uTexel.x, vUv.y - uTexel.y));\n vec4 c21 = texture2D(uTexture, vec2(vUv.x - uTexel.x, vUv.y));\n vec4 c22 = texture2D(uTexture, vUv);\n vec4 c23 = texture2D(uTexture, vec2(vUv.x + uTexel.x, vUv.y));\n vec4 c31 = texture2D(uTexture, vec2(vUv.x - uTexel.x, vUv.y + uTexel.y));\n vec4 c32 = texture2D(uTexture, vec2(vUv.x, vUv.y + uTexel.y));\n vec4 c33 = texture2D(uTexture, vUv + uTexel);\n vec4 color = c11 * uKernel[0] + c12 * uKernel[1] + c13 * uKernel[2] +\n c21 * uKernel[3] + c22 * uKernel[4] + c23 * uKernel[5] +\n c31 * uKernel[6] + c32 * uKernel[7] + c33 * uKernel[8];\n gl_FragColor = color * uAmount + (c22 * (1.0 - uAmount));\n}\n";function o(e,n,t){const r=e.createShader(n);return r?(e.shaderSource(r,t),e.compileShader(r),e.getShaderParameter(r,e.COMPILE_STATUS)?r:(e.deleteShader(r),null)):null}function i(e,n,t,r){const a=o(e,e.VERTEX_SHADER,n),i=o(e,e.FRAGMENT_SHADER,t);if(!a||!i)throw new Error("Shader compile failed.");const s=function(e,n,t){const r=e.createProgram();return r?(e.attachShader(r,n),e.attachShader(r,t),e.linkProgram(r),e.getProgramParameter(r,e.LINK_STATUS)?r:(e.deleteProgram(r),null)):null}(e,a,i);if(!s)throw new Error("Program link failed.");const l={aPosition:e.getAttribLocation(s,"aPosition"),aTexCoord:e.getAttribLocation(s,"aTexCoord"),apos:e.getAttribLocation(s,"apos"),auv:e.getAttribLocation(s,"auv")},u={};return r.forEach(n=>{u[n]=e.getUniformLocation(s,n)}),{program:s,attribs:l,uniforms:u}}function s(e,n,t){const r=e.createTexture();if(!r)throw new Error("Unable to create texture");e.bindTexture(e.TEXTURE_2D,r),e.texImage2D(e.TEXTURE_2D,0,e.RGBA,n,t,0,e.RGBA,e.UNSIGNED_BYTE,null),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,e.LINEAR),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_S,e.CLAMP_TO_EDGE),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_T,e.CLAMP_TO_EDGE);const a=e.createFramebuffer();if(!a)throw new Error("Unable to create framebuffer");return e.bindFramebuffer(e.FRAMEBUFFER,a),e.framebufferTexture2D(e.FRAMEBUFFER,e.COLOR_ATTACHMENT0,e.TEXTURE_2D,r,0),{framebuffer:a,texture:r}}var l=e=>Math.min(1,Math.max(0,e)),u=(e,n,t,r,a)=>{const o=1-e;return o*o*o*n+3*o*o*e*t+3*o*e*e*r+e*e*e*a},c=e=>{const n=Math.max(-100,Math.min(100,e))/100;return(e=>{const n=new Uint8Array(768);for(let t=0;t<256;t+=1){const r=u(t/255,0,e,.66,1),a=Math.round(255*l(r)),o=3*t;n[o]=a,n[o+1]=a,n[o+2]=a}return n})(l(.33-.35*n))},m=class extends e{constructor(e,n={}){super(e,n),this.gl=null,this.resources=null}getType(){return"webgl"}static isSupported(){if("undefined"==typeof document)return!1;try{const e=document.createElement("canvas");return!(!e.getContext("webgl")&&!e.getContext("experimental-webgl"))}catch{return!1}}init(){if(this.gl=this.canvas.getContext("webgl",{antialias:!0,premultipliedAlpha:!1,preserveDrawingBuffer:!0}),!this.gl)throw new Error("WebGL not supported");this.initialized=!0}loadFromImage(e){this.gl||this.init();const n=this.gl,t=e.naturalWidth||e.width,r=e.naturalHeight||e.height;this.width=t,this.height=r,this.canvas.width=t,this.canvas.height=r,this.disposeResources(),n.disable(n.DEPTH_TEST),n.viewport(0,0,t,r),n.pixelStorei(n.UNPACK_FLIP_Y_WEBGL,1);const a=n.createTexture();if(!a)throw new Error("Failed to create texture");n.bindTexture(n.TEXTURE_2D,a),n.texImage2D(n.TEXTURE_2D,0,n.RGBA,n.RGBA,n.UNSIGNED_BYTE,e),n.texParameteri(n.TEXTURE_2D,n.TEXTURE_MIN_FILTER,n.LINEAR),n.texParameteri(n.TEXTURE_2D,n.TEXTURE_MAG_FILTER,n.LINEAR),n.texParameteri(n.TEXTURE_2D,n.TEXTURE_WRAP_S,n.CLAMP_TO_EDGE),n.texParameteri(n.TEXTURE_2D,n.TEXTURE_WRAP_T,n.CLAMP_TO_EDGE),this.initResources(n,t,r,a)}loadFromImageData(e){this.gl||this.init();const n=this.gl,{width:t,height:r,data:a}=e;this.width=t,this.height=r,this.canvas.width=t,this.canvas.height=r,this.disposeResources(),n.viewport(0,0,t,r),n.pixelStorei(n.UNPACK_FLIP_Y_WEBGL,1);const o=n.createTexture();if(!o)throw new Error("Failed to create texture");n.bindTexture(n.TEXTURE_2D,o),n.texImage2D(n.TEXTURE_2D,0,n.RGBA,t,r,0,n.RGBA,n.UNSIGNED_BYTE,a),n.texParameteri(n.TEXTURE_2D,n.TEXTURE_MIN_FILTER,n.LINEAR),n.texParameteri(n.TEXTURE_2D,n.TEXTURE_MAG_FILTER,n.LINEAR),n.texParameteri(n.TEXTURE_2D,n.TEXTURE_WRAP_S,n.CLAMP_TO_EDGE),n.texParameteri(n.TEXTURE_2D,n.TEXTURE_WRAP_T,n.CLAMP_TO_EDGE),this.initResources(n,t,r,o)}render(e){this.resources&&this.drawFrame(this.resources,e)}getImageData(){const e=this.gl;if(e){const n=new Uint8ClampedArray(this.width*this.height*4);return e.readPixels(0,0,this.width,this.height,e.RGBA,e.UNSIGNED_BYTE,n),new ImageData(n,this.width,this.height)}throw new Error("Cannot get ImageData")}dispose(){this.disposeResources(),this.gl=null,this.initialized=!1}getShaderSource(e){return e}initResources(e,n,t,r){const o=((e,n)=>{const t=e.createTexture();if(!t)throw new Error("Unable to create palette texture");return e.bindTexture(e.TEXTURE_2D,t),e.texImage2D(e.TEXTURE_2D,0,e.RGB,256,1,0,e.RGB,e.UNSIGNED_BYTE,n),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,e.NEAREST),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,e.NEAREST),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_S,e.CLAMP_TO_EDGE),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_T,e.CLAMP_TO_EDGE),t})(e,c(0)),l=e.createBuffer(),u=e.createBuffer();if(!l||!u)throw new Error("Failed to create buffers");e.bindBuffer(e.ARRAY_BUFFER,l),e.bufferData(e.ARRAY_BUFFER,new Float32Array([-1,-1,1,-1,-1,1,1,1]),e.STATIC_DRAW),e.bindBuffer(e.ARRAY_BUFFER,u),e.bufferData(e.ARRAY_BUFFER,new Float32Array([0,0,1,0,0,1,1,1]),e.STATIC_DRAW);const m=this.getShaderSource("\nprecision highp float;\nattribute vec2 aPosition;\nattribute vec2 aTexCoord;\nvarying vec2 vUv;\nvoid main() {\n vUv = aTexCoord;\n gl_Position = vec4(aPosition, 0.0, 1.0);\n}\n"),v=this.getShaderSource("\nprecision highp float;\nattribute vec2 apos;\nattribute vec2 auv;\nvarying vec2 uv;\nuniform vec4 transform;\nvoid main(void) {\n uv = auv;\n gl_Position = vec4(\n apos.x * transform.x + transform.z,\n apos.y * transform.y + transform.w,\n 0.0,\n 1.0\n );\n}\n"),f={pass:i(e,m,this.getShaderSource("\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nvoid main() {\n gl_FragColor = texture2D(uTexture, vUv);\n}\n"),["uTexture"]),vibrance:i(e,m,this.getShaderSource("\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uAmount;\nvoid main() {\n vec4 col = texture2D(uTexture, vUv);\n vec3 color = col.rgb;\n float luminance = color.r * 0.299 + color.g * 0.587 + color.b * 0.114;\n float mn = min(min(color.r, color.g), color.b);\n float mx = max(max(color.r, color.g), color.b);\n float sat = (1.0 - (mx - mn)) * (1.0 - mx) * luminance * 5.0;\n vec3 lightness = vec3((mn + mx) / 2.0);\n color = mix(color, mix(color, lightness, -uAmount), sat);\n gl_FragColor = vec4(\n mix(color, lightness, (1.0 - lightness) * (1.0 - uAmount) / 2.0 * abs(uAmount)),\n col.a\n );\n}\n"),["uTexture","uAmount"]),saturation:i(e,m,this.getShaderSource("\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uMatrix[20];\nvoid main(void) {\n vec4 c = texture2D(uTexture, vUv);\n gl_FragColor.r = uMatrix[0] * c.r + uMatrix[1] * c.g + uMatrix[2] * c.b + uMatrix[3] * c.a + uMatrix[4];\n gl_FragColor.g = uMatrix[5] * c.r + uMatrix[6] * c.g + uMatrix[7] * c.b + uMatrix[8] * c.a + uMatrix[9];\n gl_FragColor.b = uMatrix[10] * c.r + uMatrix[11] * c.g + uMatrix[12] * c.b + uMatrix[13] * c.a + uMatrix[14];\n gl_FragColor.a = uMatrix[15] * c.r + uMatrix[16] * c.g + uMatrix[17] * c.b + uMatrix[18] * c.a + uMatrix[19];\n}\n"),["uTexture","uMatrix[0]"]),temperature:i(e,m,this.getShaderSource("\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uAmount;\nvoid main() {\n vec4 color = texture2D(uTexture, vUv);\n color.r = clamp(color.r + uAmount, 0.0, 1.0);\n color.b = clamp(color.b - uAmount, 0.0, 1.0);\n gl_FragColor = color;\n}\n"),["uTexture","uAmount"]),tint:i(e,m,this.getShaderSource("\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uAmount;\nvoid main() {\n vec4 color = texture2D(uTexture, vUv);\n color.g = clamp(color.g + uAmount, 0.0, 1.0);\n gl_FragColor = color;\n}\n"),["uTexture","uAmount"]),hue:i(e,m,this.getShaderSource("\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uRotation;\nvec3 rgb2hsv(vec3 c) {\n vec4 K = vec4(0.0, -1.0 / 3.0, 2.0 / 3.0, -1.0);\n vec4 p = mix(vec4(c.bg, K.wz), vec4(c.gb, K.xy), step(c.b, c.g));\n vec4 q = mix(vec4(p.xyw, c.r), vec4(c.r, p.yzx), step(p.x, c.r));\n float d = q.x - min(q.w, q.y);\n float e = 1.0e-10;\n return vec3(abs(q.z + (q.w - q.y) / (6.0 * d + e)), d / (q.x + e), q.x);\n}\nvec3 hsv2rgb(vec3 c) {\n vec4 K = vec4(1.0, 2.0 / 3.0, 1.0 / 3.0, 3.0);\n vec3 p = abs(fract(c.xxx + K.xyz) * 6.0 - K.www);\n return c.z * mix(K.xxx, clamp(p - K.xxx, 0.0, 1.0), c.y);\n}\nvoid main() {\n lowp vec4 base = texture2D(uTexture, vUv);\n vec3 hsv = rgb2hsv(base.rgb);\n hsv.x = fract(hsv.x + uRotation);\n gl_FragColor = vec4(hsv2rgb(hsv), base.a);\n}\n"),["uTexture","uRotation"]),brightness:i(e,m,this.getShaderSource("\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uAmount;\nconst float PI = 3.1415926535897932384626433832795;\nvoid main() {\n vec4 color = texture2D(uTexture, vUv);\n if (uAmount >= 0.0) {\n color.r = color.r + uAmount * sin(color.r * PI);\n color.g = color.g + uAmount * sin(color.g * PI);\n color.b = color.b + uAmount * sin(color.b * PI);\n } else {\n color.r = (1.0 + uAmount) * color.r;\n color.g = (1.0 + uAmount) * color.g;\n color.b = (1.0 + uAmount) * color.b;\n }\n gl_FragColor = color;\n}\n"),["uTexture","uAmount"]),exposure:i(e,m,this.getShaderSource("\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uAmount;\nconst float epsilon = 0.000001;\nconst float mx = 1.0 - epsilon;\nconst mat3 matRGBtoROMM = mat3(\n 0.5293459296226501, 0.3300727903842926, 0.14058130979537964,\n 0.09837432950735092, 0.8734610080718994, 0.028164653107523918,\n 0.01688321679830551, 0.11767247319221497, 0.8654443025588989\n);\nconst mat3 matROMMtoRGB = mat3(\n 2.0340757369995117, -0.727334201335907, -0.3067416846752167,\n -0.22881317138671875, 1.2317301034927368, -0.0029169507324695587,\n -0.008569774217903614, -0.1532866358757019, 1.1618564128875732\n);\nfloat ramp(in float t) {\n t *= 2.0;\n if (t >= 1.0) {\n t -= 1.0;\n t = log(0.5) / log(0.5 * (1.0 - t) + 0.9332 * t);\n }\n return clamp(t, 0.001, 10.0);\n}\nvec3 rgb2hsv(in vec3 c) {\n vec4 K = vec4(0.0, -1.0 / 3.0, 2.0 / 3.0, -1.0);\n vec4 p = mix(vec4(c.bg, K.wz), vec4(c.gb, K.xy), step(c.b, c.g));\n vec4 q = mix(vec4(p.xyw, c.r), vec4(c.r, p.yzx), step(p.x, c.r));\n float d = q.x - min(q.w, q.y);\n float e = 1.0e-10;\n return vec3(abs(q.z + (q.w - q.y) / (6.0 * d + e)), d / (q.x + e), q.x);\n}\nvec3 hsv2rgb(in vec3 c) {\n vec4 K = vec4(1.0, 2.0 / 3.0, 1.0 / 3.0, 3.0);\n vec3 p = abs(fract(c.xxx + K.xyz) * 6.0 - K.www);\n return c.z * mix(K.xxx, clamp(p - K.xxx, 0.0, 1.0), c.y);\n}\nvec3 setHue(in vec3 res, in vec3 base) {\n vec3 hsv = rgb2hsv(base);\n vec3 res_hsv = rgb2hsv(res);\n return hsv2rgb(vec3(hsv.x, res_hsv.y, res_hsv.z));\n}\nvoid main() {\n lowp vec4 col = texture2D(uTexture, vUv);\n vec3 base = col.rgb * matRGBtoROMM;\n float a = abs(uAmount) * col.a + epsilon;\n float v = pow(2.0, a * 2.0 + 1.0) - 2.0;\n float m = mx - exp(-v);\n vec3 res = (uAmount > 0.0) ? (1.0 - exp(-v * base)) / m : log(1.0 - base * m) / -v;\n res = mix(base, res, min(a * 100.0, 1.0));\n res = setHue(res, base);\n res = pow(res, vec3(ramp(1.0 - (0.0 * col.a + 1.0) / 2.0)));\n res = res * matROMMtoRGB;\n gl_FragColor = vec4(res, col.a);\n}\n"),["uTexture","uAmount"]),contrast:i(e,m,this.getShaderSource("\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uMatrix[20];\nvoid main(void) {\n vec4 c = texture2D(uTexture, vUv);\n gl_FragColor.r = uMatrix[0] * c.r + uMatrix[1] * c.g + uMatrix[2] * c.b + uMatrix[3] * c.a + uMatrix[4];\n gl_FragColor.g = uMatrix[5] * c.r + uMatrix[6] * c.g + uMatrix[7] * c.b + uMatrix[8] * c.a + uMatrix[9];\n gl_FragColor.b = uMatrix[10] * c.r + uMatrix[11] * c.g + uMatrix[12] * c.b + uMatrix[13] * c.a + uMatrix[14];\n gl_FragColor.a = uMatrix[15] * c.r + uMatrix[16] * c.g + uMatrix[17] * c.b + uMatrix[18] * c.a + uMatrix[19];\n}\n"),["uTexture","uMatrix[0]"]),blacks:i(e,v,this.getShaderSource("\nprecision highp float;\nvarying vec2 uv;\nuniform sampler2D uTexture;\nuniform sampler2D uPaletteMap;\nvoid main() {\n lowp vec4 base = texture2D(uTexture, uv.xy);\n float r = texture2D(uPaletteMap, vec2(base.r, 0.0)).r;\n float g = texture2D(uPaletteMap, vec2(base.g, 0.0)).g;\n float b = texture2D(uPaletteMap, vec2(base.b, 0.0)).b;\n gl_FragColor = vec4(r, g, b, base.a);\n}\n"),["uTexture","uPaletteMap","transform"]),whites:i(e,m,this.getShaderSource("\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uAmount;\nconst vec3 RGB2Y = vec3(0.2126, 0.7152, 0.0722);\nvoid main() {\n vec4 base = texture2D(uTexture, vUv.xy);\n vec3 color = base.rgb;\n float lum = dot(color, RGB2Y);\n float whiteMask = smoothstep(0.5, 1.0, lum);\n color += uAmount * whiteMask;\n gl_FragColor = vec4(clamp(color, 0.0, 1.0), base.a);\n}\n"),["uTexture","uAmount"]),highlights:i(e,m,this.getShaderSource("\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uAmount;\nconst float epsilon = 0.000001;\nconst float mx = 1.0 - epsilon;\nconst float PI = 3.1415926535897932384626433832795;\nconst mat3 matRGBtoROMM = mat3(\n 0.5293459296226501, 0.3300727903842926, 0.14058130979537964,\n 0.09837432950735092, 0.8734610080718994, 0.028164653107523918,\n 0.01688321679830551, 0.11767247319221497, 0.8654443025588989\n);\nconst mat3 matROMMtoRGB = mat3(\n 2.0340757369995117, -0.727334201335907, -0.3067416846752167,\n -0.22881317138671875, 1.2317301034927368, -0.0029169507324695587,\n -0.008569774217903614, -0.1532866358757019, 1.1618564128875732\n);\nfloat luma_romm(in vec3 color) {\n return dot(color, vec3(0.242655, 0.755158, 0.002187));\n}\nfloat luma(in vec3 color) {\n return dot(color, vec3(0.298839, 0.586811, 0.11435));\n}\nvec3 rgb2hsv(in vec3 c) {\n vec4 K = vec4(0.0, -1.0 / 3.0, 2.0 / 3.0, -1.0);\n vec4 p = mix(vec4(c.bg, K.wz), vec4(c.gb, K.xy), step(c.b, c.g));\n vec4 q = mix(vec4(p.xyw, c.r), vec4(c.r, p.yzx), step(p.x, c.r));\n float d = q.x - min(q.w, q.y);\n float e = 1.0e-10;\n return vec3(abs(q.z + (q.w - q.y) / (6.0 * d + e)), d / (q.x + e), q.x);\n}\nvec3 hsv2rgb(in vec3 c) {\n vec4 K = vec4(1.0, 2.0 / 3.0, 1.0 / 3.0, 3.0);\n vec3 p = abs(fract(c.xxx + K.xyz) * 6.0 - K.www);\n return c.z * mix(K.xxx, clamp(p - K.xxx, 0.0, 1.0), c.y);\n}\nvec3 setHue(in vec3 res, in vec3 base) {\n vec3 hsv = rgb2hsv(base);\n vec3 res_hsv = rgb2hsv(res);\n return hsv2rgb(vec3(hsv.x, res_hsv.y, res_hsv.z));\n}\nfloat gaussian(in float x) {\n return 1.0 - exp(-PI * 2.0 * x * x);\n}\nvoid main() {\n lowp vec4 col = texture2D(uTexture, vUv);\n lowp vec3 map = col.rgb;\n vec3 base = col.rgb * matRGBtoROMM;\n float base_lum = luma(col.rgb);\n float map_lum = luma_romm(map * matRGBtoROMM);\n float exposure = mix(uAmount, 0.0, 1.0 - map_lum) * col.a;\n float a = abs(exposure) * col.a + epsilon;\n float v = pow(2.0, a + 1.0) - 2.0;\n float m = mx - exp(-v);\n vec3 res = (exposure > 0.0) ? (1.0 - exp(-v * base)) / m : log(1.0 - base * m) / -v;\n res = mix(base, res, min(a * 100.0, 1.0));\n res = setHue(res, base);\n res = res * matROMMtoRGB;\n gl_FragColor = vec4(res, col.a);\n}\n"),["uTexture","uAmount"]),shadows:i(e,m,this.getShaderSource("\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uAmount;\nconst float epsilon = 0.000001;\nconst float mx = 1.0 - epsilon;\nconst float PI = 3.1415926535897932384626433832795;\nconst mat3 matRGBtoROMM = mat3(\n 0.5293459296226501, 0.3300727903842926, 0.14058130979537964,\n 0.09837432950735092, 0.8734610080718994, 0.028164653107523918,\n 0.01688321679830551, 0.11767247319221497, 0.8654443025588989\n);\nconst mat3 matROMMtoRGB = mat3(\n 2.0340757369995117, -0.727334201335907, -0.3067416846752167,\n -0.22881317138671875, 1.2317301034927368, -0.0029169507324695587,\n -0.008569774217903614, -0.1532866358757019, 1.1618564128875732\n);\nfloat luma_romm(in vec3 color) {\n return dot(color, vec3(0.242655, 0.755158, 0.002187));\n}\nfloat luma(in vec3 color) {\n return dot(color, vec3(0.298839, 0.586811, 0.11435));\n}\nvec3 rgb2hsv(in vec3 c) {\n vec4 K = vec4(0.0, -1.0 / 3.0, 2.0 / 3.0, -1.0);\n vec4 p = mix(vec4(c.bg, K.wz), vec4(c.gb, K.xy), step(c.b, c.g));\n vec4 q = mix(vec4(p.xyw, c.r), vec4(c.r, p.yzx), step(p.x, c.r));\n float d = q.x - min(q.w, q.y);\n float e = 1.0e-10;\n return vec3(abs(q.z + (q.w - q.y) / (6.0 * d + e)), d / (q.x + e), q.x);\n}\nvec3 hsv2rgb(in vec3 c) {\n vec4 K = vec4(1.0, 2.0 / 3.0, 1.0 / 3.0, 3.0);\n vec3 p = abs(fract(c.xxx + K.xyz) * 6.0 - K.www);\n return c.z * mix(K.xxx, clamp(p - K.xxx, 0.0, 1.0), c.y);\n}\nvec3 setHue(in vec3 res, in vec3 base) {\n vec3 hsv = rgb2hsv(base);\n vec3 res_hsv = rgb2hsv(res);\n return hsv2rgb(vec3(hsv.x, res_hsv.y, res_hsv.z));\n}\nfloat gaussian(in float x) {\n return 1.0 - exp(-PI * 2.0 * x * x);\n}\nvoid main() {\n lowp vec4 col = texture2D(uTexture, vUv);\n lowp vec3 map = col.rgb;\n vec3 base = col.rgb * matRGBtoROMM;\n float base_lum = luma(col.rgb);\n float map_lum = luma_romm(map * matRGBtoROMM);\n float exposure = mix(0.0, uAmount, 1.0 - map_lum) * col.a;\n float a = abs(exposure) * col.a + epsilon;\n float v = pow(2.0, a + 1.0) - 2.0;\n float m = mx - exp(-v);\n vec3 res = (exposure > 0.0) ? (1.0 - exp(-v * base)) / m : log(1.0 - base * m) / -v;\n res = mix(base, res, min(a * 100.0, 1.0));\n res = setHue(res, base);\n res = res * matROMMtoRGB;\n gl_FragColor = vec4(res, col.a);\n}\n"),["uTexture","uAmount"]),dehaze:i(e,m,this.getShaderSource("\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uAmount;\nuniform vec2 uSize;\n\nfloat hazeMap(vec2 coord) {\n vec3 color = vec3(1.0);\n vec2 stepSize = vec2(1.0 / uSize.x, 1.0 / uSize.y);\n for (int i = -1; i <= 1; ++i) {\n for (int j = -1; j <= 1; ++j) {\n vec2 offset = vec2(float(i), float(j)) * stepSize;\n vec2 uv = clamp(coord + offset, 0.0, 1.0);\n vec3 sample = texture2D(uTexture, uv).rgb;\n color = min(color, sample);\n }\n }\n return min(color.r, min(color.g, color.b));\n}\n\nvoid main() {\n vec4 base = texture2D(uTexture, vUv);\n float haze = hazeMap(vUv);\n float transmission = 1.0 - 0.95 * haze;\n const float A = 0.95;\n const float t0 = 0.1;\n float t = mix(1.0, max(t0, transmission), uAmount);\n vec3 J = (base.rgb - A) / t + A;\n gl_FragColor = vec4(J, base.a);\n}\n"),["uTexture","uAmount","uSize"]),bloom:i(e,m,this.getShaderSource("\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uAmount;\nuniform vec2 uTexel;\nuniform float uThreshold;\n\nvoid main() {\n vec4 sum = vec4(0.0);\n int j = -2;\n for (int i = -2; i <= 2; i++) sum += texture2D(uTexture, vUv + vec2(float(i), float(j)) * uTexel);\n j = -1;\n for (int i = -2; i <= 2; i++) sum += texture2D(uTexture, vUv + vec2(float(i), float(j)) * uTexel);\n j = 0;\n for (int i = -2; i <= 2; i++) sum += texture2D(uTexture, vUv + vec2(float(i), float(j)) * uTexel);\n j = 1;\n for (int i = -2; i <= 2; i++) sum += texture2D(uTexture, vUv + vec2(float(i), float(j)) * uTexel);\n j = 2;\n for (int i = -2; i <= 2; i++) sum += texture2D(uTexture, vUv + vec2(float(i), float(j)) * uTexel);\n sum /= 25.0;\n vec4 base = texture2D(uTexture, vUv);\n if (length(sum.rgb) > uThreshold) {\n base += sum * uAmount;\n }\n gl_FragColor = base;\n}\n"),["uTexture","uAmount","uTexel","uThreshold"]),glamour:i(e,m,this.getShaderSource("\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uAmount;\nuniform vec2 uTexel;\n\nfloat normpdf(in float x, in float sigma) {\n return 0.39894 * exp(-0.5 * x * x / (sigma * sigma)) / sigma;\n}\n\nvec3 blurMap() {\n const int mSize = 11;\n const int kSize = (mSize - 1) / 2;\n float kernel[mSize];\n vec3 final_colour = vec3(0.0);\n float sigma = 7.0;\n float Z = 0.0;\n for (int j = 0; j <= kSize; ++j) {\n kernel[kSize + j] = kernel[kSize - j] = normpdf(float(j), sigma);\n }\n for (int j = 0; j < mSize; ++j) {\n Z += kernel[j];\n }\n for (int i = -kSize; i <= kSize; ++i) {\n for (int j = -kSize; j <= kSize; ++j) {\n final_colour += kernel[kSize + j] * kernel[kSize + i] *\n texture2D(uTexture, vUv + vec2(float(i), float(j)) * uTexel).rgb;\n }\n }\n return vec3(final_colour / (Z * Z));\n}\n\nfloat luma(vec3 color) {\n return dot(color, vec3(0.299, 0.587, 0.114));\n}\n\nvoid main() {\n vec4 base = texture2D(uTexture, vUv);\n vec3 color = blurMap();\n color = vec3(luma(color));\n color = vec3(\n (base.r <= 0.5) ? (2.0 * base.r * color.r) : (1.0 - 2.0 * (1.0 - base.r) * (1.0 - color.r)),\n (base.g <= 0.5) ? (2.0 * base.g * color.g) : (1.0 - 2.0 * (1.0 - base.g) * (1.0 - color.g)),\n (base.b <= 0.5) ? (2.0 * base.b * color.b) : (1.0 - 2.0 * (1.0 - base.b) * (1.0 - color.b))\n );\n gl_FragColor = mix(base, vec4(color, base.a), uAmount);\n}\n"),["uTexture","uAmount","uTexel"]),clarity:i(e,m,this.getShaderSource("\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uAmount;\nuniform vec2 uTexel;\n\nfloat Lum(vec3 c) {\n return 0.299 * c.r + 0.587 * c.g + 0.114 * c.b;\n}\nfloat BlendOverlayf(float base, float blend) {\n return (base < 0.5 ? (2.0 * base * blend) : (1.0 - 2.0 * (1.0 - base) * (1.0 - blend)));\n}\nvec3 BlendOverlay(vec3 base, vec3 blend) {\n return vec3(BlendOverlayf(base.r, blend.r), BlendOverlayf(base.g, blend.g), BlendOverlayf(base.b, blend.b));\n}\nfloat BlendVividLightf(float base, float blend) {\n float BlendColorBurnf = (((2.0 * blend) == 0.0) ? (2.0 * blend) : max((1.0 - ((1.0 - base) / (2.0 * blend))), 0.0));\n float BlendColorDodgef = (((2.0 * (blend - 0.5)) == 1.0) ? (2.0 * (blend - 0.5)) : min(base / (1.0 - (2.0 * (blend - 0.5))), 1.0));\n return ((blend < 0.5) ? BlendColorBurnf : BlendColorDodgef);\n}\nvec3 BlendVividLight(vec3 base, vec3 blend) {\n return vec3(BlendVividLightf(base.r, blend.r), BlendVividLightf(base.g, blend.g), BlendVividLightf(base.b, blend.b));\n}\nfloat normpdf(in float x, in float sigma) {\n return 0.39894 * exp(-0.5 * x * x / (sigma * sigma)) / sigma;\n}\nvec3 blurMap() {\n const int mSize = 11;\n const int kSize = (mSize - 1) / 2;\n float kernel[mSize];\n vec3 final_colour = vec3(0.0);\n float sigma = 7.0;\n float Z = 0.0;\n for (int j = 0; j <= kSize; ++j) {\n kernel[kSize + j] = kernel[kSize - j] = normpdf(float(j), sigma);\n }\n for (int j = 0; j < mSize; ++j) {\n Z += kernel[j];\n }\n for (int i = -kSize; i <= kSize; ++i) {\n for (int j = -kSize; j <= kSize; ++j) {\n final_colour += kernel[kSize + j] * kernel[kSize + i] *\n texture2D(uTexture, vUv + vec2(float(i), float(j)) * uTexel).rgb;\n }\n }\n return vec3(final_colour / (Z * Z));\n}\nvoid main() {\n vec4 base4 = texture2D(uTexture, vUv);\n vec3 blur = blurMap();\n vec3 base = base4.rgb;\n float intensity = (uAmount < 0.0) ? (uAmount / 2.0) : uAmount;\n float lum = Lum(base);\n vec3 col = vec3(lum);\n vec3 mask = vec3(1.0 - pow(lum, 1.8));\n vec3 layer = vec3(1.0 - Lum(blur));\n vec3 detail = clamp(BlendVividLight(col, layer), 0.0, 1.0);\n vec3 inverse = mix(1.0 - detail, detail, (intensity + 1.0) / 2.0);\n gl_FragColor = vec4(BlendOverlay(base, mix(vec3(0.5), inverse, mask)), base4.a);\n}\n"),["uTexture","uAmount","uTexel"]),sharpen:i(e,m,this.getShaderSource(a),["uTexture","uTexel","uKernel[0]","uAmount"]),smooth:i(e,m,this.getShaderSource(a),["uTexture","uTexel","uKernel[0]","uAmount"]),blur:i(e,m,this.getShaderSource("\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform vec2 uSize;\nfloat random(vec3 scale, float seed) {\n return fract(sin(dot(gl_FragCoord.xyz + seed, scale)) * 43758.5453 + seed);\n}\nvoid main() {\n vec4 color = vec4(0.0);\n float total = 0.0;\n float offset = random(vec3(12.9898, 78.233, 151.7182), 0.0);\n for (int t = -30; t <= 30; t++) {\n float percent = (float(t) + offset - 0.5) / 30.0;\n float weight = 1.0 - abs(percent);\n vec4 sample = texture2D(uTexture, vUv + uSize * percent);\n sample.rgb *= sample.a;\n color += sample * weight;\n total += weight;\n }\n gl_FragColor = color / total;\n gl_FragColor.rgb /= gl_FragColor.a + 0.00001;\n}\n"),["uTexture","uSize"]),vignette:i(e,m,this.getShaderSource("\nprecision highp float;\nvarying vec2 vUv;\nuniform sampler2D uTexture;\nuniform float uAmount;\nuniform float uSize;\nvoid main() {\n vec4 color = texture2D(uTexture, vUv);\n float dist = distance(vUv, vec2(0.5, 0.5));\n float amt = clamp(uAmount, -1.0, 1.0);\n float edge = dist * (abs(amt) * 0.75 + uSize * 2.0);\n float vignette = smoothstep(0.8, uSize * 0.799, edge);\n if (amt < 0.0) {\n vignette = 1.0 + (1.0 - vignette) * (-amt);\n } else {\n vignette = mix(1.0, vignette, amt);\n }\n color.rgb *= vignette;\n gl_FragColor = color;\n}\n"),["uTexture","uAmount","uSize"]),grain:i(e,m,this.getShaderSource("\nprecision highp float;\nuniform sampler2D uTexture;\nvarying vec2 vUv;\nuniform vec2 uResolution;\nuniform float uAmount;\nuniform float uTime;\nconst float permTexUnit = 1.0 / 256.0;\nconst float permTexUnitHalf = 0.5 / 256.0;\nfloat grainsize = 1.8;\nfloat lumamount = 1.0;\n\nvec4 rnm(in vec2 tc) {\n float noise = sin(dot(tc + vec2(uTime, uTime), vec2(12.9898, 78.233))) * 43758.5453;\n float noiseR = fract(noise) * 2.0 - 1.0;\n float noiseG = fract(noise * 1.2154) * 2.0 - 1.0;\n float noiseB = fract(noise * 1.3453) * 2.0 - 1.0;\n float noiseA = fract(noise * 1.3647) * 2.0 - 1.0;\n return vec4(noiseR, noiseG, noiseB, noiseA);\n}\nfloat fade(in float t) {\n return t * t * t * (t * (t * 6.0 - 15.0) + 10.0);\n}\nfloat pnoise3D(in vec3 p) {\n vec3 pi = permTexUnit * floor(p) + permTexUnitHalf;\n vec3 pf = fract(p);\n float perm00 = rnm(pi.xy).a;\n vec3 grad000 = rnm(vec2(perm00, pi.z)).rgb * 4.0 - 1.0;\n float n000 = dot(grad000, pf);\n vec3 grad001 = rnm(vec2(perm00, pi.z + permTexUnit)).rgb * 4.0 - 1.0;\n float n001 = dot(grad001, pf - vec3(0.0, 0.0, 1.0));\n float perm01 = rnm(pi.xy + vec2(0.0, permTexUnit)).a;\n vec3 grad010 = rnm(vec2(perm01, pi.z)).rgb * 4.0 - 1.0;\n float n010 = dot(grad010, pf - vec3(0.0, 1.0, 0.0));\n vec3 grad011 = rnm(vec2(perm01, pi.z + permTexUnit)).rgb * 4.0 - 1.0;\n float n011 = dot(grad011, pf - vec3(0.0, 1.0, 1.0));\n float perm10 = rnm(pi.xy + vec2(permTexUnit, 0.0)).a;\n vec3 grad100 = rnm(vec2(perm10, pi.z)).rgb * 4.0 - 1.0;\n float n100 = dot(grad100, pf - vec3(1.0, 0.0, 0.0));\n vec3 grad101 = rnm(vec2(perm10, pi.z + permTexUnit)).rgb * 4.0 - 1.0;\n float n101 = dot(grad101, pf - vec3(1.0, 0.0, 1.0));\n float perm11 = rnm(pi.xy + vec2(permTexUnit, permTexUnit)).a;\n vec3 grad110 = rnm(vec2(perm11, pi.z)).rgb * 4.0 - 1.0;\n float n110 = dot(grad110, pf - vec3(1.0, 1.0, 0.0));\n vec3 grad111 = rnm(vec2(perm11, pi.z + permTexUnit)).rgb * 4.0 - 1.0;\n float n111 = dot(grad111, pf - vec3(1.0, 1.0, 1.0));\n vec4 n_x = mix(vec4(n000, n001, n010, n011), vec4(n100, n101, n110, n111), fade(pf.x));\n vec2 n_xy = mix(n_x.xy, n_x.zw, fade(pf.y));\n float n_xyz = mix(n_xy.x, n_xy.y, fade(pf.z));\n return n_xyz;\n}\nvec2 coordRot(in vec2 tc, in float angle) {\n float aspect = uResolution.x / uResolution.y;\n float rotX = ((tc.x * 2.0 - 1.0) * aspect * cos(angle)) - ((tc.y * 2.0 - 1.0) * sin(angle));\n float rotY = ((tc.y * 2.0 - 1.0) * cos(angle)) + ((tc.x * 2.0 - 1.0) * aspect * sin(angle));\n rotX = ((rotX / aspect) * 0.5 + 0.5);\n rotY = rotY * 0.5 + 0.5;\n return vec2(rotX, rotY);\n}\nvoid main() {\n vec3 rotOffset = vec3(1.425, 3.892, 5.835);\n vec2 rotCoordsR = coordRot(vUv, uTime + rotOffset.x);\n vec3 noise = vec3(pnoise3D(vec3(rotCoordsR * vec2(uResolution.x / grainsize, uResolution.y / grainsize), 0.0)));\n vec4 tex = texture2D(uTexture, vUv);\n vec3 col = tex.rgb;\n vec3 lumcoeff = vec3(0.299, 0.587, 0.114);\n float luminance = mix(0.0, dot(col, lumcoeff), lumamount);\n float lum = smoothstep(0.2, 0.0, luminance);\n lum += luminance;\n noise = mix(noise, vec3(0.0), pow(lum, 4.0));\n col = col + noise * uAmount;\n gl_FragColor = vec4(col, tex.a);\n}\n"),["uTexture","uResolution","uAmount","uTime"])},x=[s(e,n,t),s(e,n,t)];this.resources={gl:e,width:n,height:t,sourceTexture:r,blackPalette:o,quad:{positionBuffer:l,texCoordBuffer:u},programs:f,targets:x}}disposeResources(){if(!this.resources)return;const{gl:e,sourceTexture:n,blackPalette:t,quad:r,programs:a,targets:o}=this.resources;e.deleteTexture(n),e.deleteTexture(t),e.deleteBuffer(r.positionBuffer),e.deleteBuffer(r.texCoordBuffer),o.forEach(n=>{e.deleteFramebuffer(n.framebuffer),e.deleteTexture(n.texture)}),Object.values(a).forEach(n=>{e.deleteProgram(n.program)}),this.resources=null}drawFrame(e,n){const{gl:t,width:r,height:a,sourceTexture:o,blackPalette:i,quad:s,programs:l,targets:u}=e;t.viewport(0,0,r,a);const m=[1/r,1/a];let v=o,f=0;const x=(e,n,r)=>{t.useProgram(e.program),(e=>{t.bindBuffer(t.ARRAY_BUFFER,s.positionBuffer);const n=e.attribs.aPosition>=0?e.attribs.aPosition:e.attribs.apos;n>=0&&(t.enableVertexAttribArray(n),t.vertexAttribPointer(n,2,t.FLOAT,!1,0,0)),t.bindBuffer(t.ARRAY_BUFFER,s.texCoordBuffer);const r=e.attribs.aTexCoord>=0?e.attribs.aTexCoord:e.attribs.auv;r>=0&&(t.enableVertexAttribArray(r),t.vertexAttribPointer(r,2,t.FLOAT,!1,0,0))})(e),t.activeTexture(t.TEXTURE0),t.bindTexture(t.TEXTURE_2D,v);const a=e.uniforms.uTexture;a&&t.uniform1i(a,0),n(),t.bindFramebuffer(t.FRAMEBUFFER,r?r.framebuffer:null),t.drawArrays(t.TRIANGLE_STRIP,0,4),v=r?r.texture:v},p=()=>{const e=u[f%2];return f+=1,e};Math.abs(n.vibrance)>.5&&x(l.vibrance,()=>{t.uniform1f(l.vibrance.uniforms.uAmount,n.vibrance/100)},p()),Math.abs(n.saturation)>.5&&x(l.saturation,()=>{const e=(e=>{const n=1+Math.max(-100,Math.min(100,e))/100,t=.299,r=.587,a=.114,o=1-n;return new Float32Array([o*t+n,o*r,o*a,0,0,o*t,o*r+n,o*a,0,0,o*t,o*r,o*a+n,0,0,0,0,0,1,0])})(n.saturation);t.uniform1fv(l.saturation.uniforms["uMatrix[0]"],e)},p()),Math.abs(n.temperature)>.5&&x(l.temperature,()=>{t.uniform1f(l.temperature.uniforms.uAmount,n.temperature/500)},p()),Math.abs(n.tint)>.5&&x(l.tint,()=>{t.uniform1f(l.tint.uniforms.uAmount,n.tint/500)},p()),Math.abs(n.hue)>.5&&x(l.hue,()=>{t.uniform1f(l.hue.uniforms.uRotation,n.hue/200)},p()),x(l.brightness,()=>{t.uniform1f(l.brightness.uniforms.uAmount,n.brightness/200)},p()),Math.abs(n.exposure)>.5&&x(l.exposure,()=>{t.uniform1f(l.exposure.uniforms.uAmount,n.exposure/100)},p()),Math.abs(n.contrast)>.5&&x(l.contrast,()=>{const e=(e=>{const n=1+Math.max(-100,Math.min(100,e))/100,t=.5*(1-n);return new Float32Array([n,0,0,0,t,0,n,0,0,t,0,0,n,0,t,0,0,0,1,0])})(n.contrast);t.uniform1fv(l.contrast.uniforms["uMatrix[0]"],e)},p()),Math.abs(n.blacks)>.5&&(((e,n,t)=>{e.bindTexture(e.TEXTURE_2D,n),e.texSubImage2D(e.TEXTURE_2D,0,0,0,256,1,e.RGB,e.UNSIGNED_BYTE,t)})(t,i,c(n.blacks)),x(l.blacks,()=>{t.activeTexture(t.TEXTURE1),t.bindTexture(t.TEXTURE_2D,i),t.uniform1i(l.blacks.uniforms.uPaletteMap,1),t.uniform4f(l.blacks.uniforms.transform,1,1,0,0),t.activeTexture(t.TEXTURE0)},p())),Math.abs(n.whites)>.5&&x(l.whites,()=>{t.uniform1f(l.whites.uniforms.uAmount,n.whites/400)},p()),Math.abs(n.highlights)>.5&&x(l.highlights,()=>{t.uniform1f(l.highlights.uniforms.uAmount,n.highlights/100)},p()),Math.abs(n.shadows)>.5&&x(l.shadows,()=>{t.uniform1f(l.shadows.uniforms.uAmount,n.shadows/100)},p()),Math.abs(n.dehaze)>.5&&x(l.dehaze,()=>{t.uniform1f(l.dehaze.uniforms.uAmount,n.dehaze/100),t.uniform2f(l.dehaze.uniforms.uSize,r,a)},p()),n.bloom>.5&&x(l.bloom,()=>{t.uniform1f(l.bloom.uniforms.uAmount,n.bloom/100),t.uniform2f(l.bloom.uniforms.uTexel,m[0],m[1]),t.uniform1f(l.bloom.uniforms.uThreshold,.5)},p()),n.glamour>.5&&x(l.glamour,()=>{t.uniform1f(l.glamour.uniforms.uAmount,n.glamour/100),t.uniform2f(l.glamour.uniforms.uTexel,m[0],m[1])},p()),Math.abs(n.clarity)>.5&&x(l.clarity,()=>{t.uniform1f(l.clarity.uniforms.uAmount,n.clarity/100),t.uniform2f(l.clarity.uniforms.uTexel,m[0],m[1])},p()),n.sharpen>.5&&x(l.sharpen,()=>{t.uniform2f(l.sharpen.uniforms.uTexel,m[0],m[1]),t.uniform1f(l.sharpen.uniforms.uAmount,n.sharpen/100),t.uniform1fv(l.sharpen.uniforms["uKernel[0]"],new Float32Array([0,-1,0,-1,5,-1,0,-1,0]))},p()),n.smooth>.5&&x(l.smooth,()=>{t.uniform2f(l.smooth.uniforms.uTexel,m[0],m[1]),t.uniform1f(l.smooth.uniforms.uAmount,n.smooth/100),t.uniform1fv(l.smooth.uniforms["uKernel[0]"],new Float32Array([1/9,1/9,1/9,1/9,1/9,1/9,1/9,1/9,1/9]))},p());const g=n.blur;x(l.blur,()=>{t.uniform2f(l.blur.uniforms.uSize,g/r,0)},p()),x(l.blur,()=>{t.uniform2f(l.blur.uniforms.uSize,0,g/a)},p()),x(l.vignette,()=>{t.uniform1f(l.vignette.uniforms.uAmount,n.vignette/100),t.uniform1f(l.vignette.uniforms.uSize,.25)},p()),x(l.grain,()=>{t.uniform2f(l.grain.uniforms.uResolution,r,a),t.uniform1f(l.grain.uniforms.uAmount,n.grain/800),t.uniform1f(l.grain.uniforms.uTime,0)},p()),x(l.pass,()=>{},null)}},v="\nstruct Params {\n matrix: array<vec4<f32>, 5>,\n}\n\n@group(0) @binding(0) var uTexture: texture_2d<f32>;\n@group(0) @binding(1) var uSampler: sampler;\n@group(0) @binding(2) var<uniform> params: Params;\n\n@fragment\nfn main(@location(0) uv: vec2<f32>) -> @location(0) vec4<f32> {\n let c = textureSample(uTexture, uSampler, uv);\n var result: vec4<f32>;\n result.r = params.matrix[0].x * c.r + params.matrix[0].y * c.g + params.matrix[0].z * c.b + params.matrix[0].w * c.a + params.matrix[1].x;\n result.g = params.matrix[1].y * c.r + params.matrix[1].z * c.g + params.matrix[1].w * c.b + params.matrix[2].x * c.a + params.matrix[2].y;\n result.b = params.matrix[2].z * c.r + params.matrix[2].w * c.g + params.matrix[3].x * c.b + params.matrix[3].y * c.a + params.matrix[3].z;\n result.a = params.matrix[3].w * c.r + params.matrix[4].x * c.g + params.matrix[4].y * c.b + params.matrix[4].z * c.a + params.matrix[4].w;\n return result;\n}\n",f=v,x=e=>Math.min(1,Math.max(0,e)),p=(e,n,t,r,a)=>{const o=1-e;return o*o*o*n+3*o*o*e*t+3*o*e*e*r+e*e*e*a},g=class extends e{constructor(e,n={}){super(e,n),this.device=null,this.resources=null}getType(){return"webgpu"}static isSupported(){return"undefined"!=typeof navigator&&"gpu"in navigator}async init(){if(!navigator.gpu)throw new Error("WebGPU not supported");const e=await navigator.gpu.requestAdapter();if(!e)throw new Error("No WebGPU adapter found");this.device=await e.requestDevice(),this.initialized=!0}loadFromImage(e){if(!this.device)throw new Error("WebGPU not initialized. Call init() first.");const n=e.naturalWidth||e.width,t=e.naturalHeight||e.height;this.width=n,this.height=t,this.canvas.width=n,this.canvas.height=t,this.disposeResources(),this.initResources(this.device,n,t,e)}loadFromImageData(e){if(!this.device)throw new Error("WebGPU not initialized. Call init() first.");const{width:n,height:t}=e;this.width=n,this.height=t,this.canvas.width=n,this.canvas.height=t,this.disposeResources(),this.initResourcesFromImageData(this.device,n,t,e)}render(e){this.resources&&this.drawFrame(this.resources,e)}getImageData(){if(!this.resources)throw new Error("No image loaded");const e=document.createElement("canvas").getContext("2d");if(!e)throw new Error("Cannot create 2D context");const{width:n,height:t}=this.resources;return e.canvas.width=n,e.canvas.height=t,e.drawImage(this.canvas,0,0),e.getImageData(0,0,n,t)}async getImageDataAsync(){if(!this.resources)throw new Error("No image loaded");const{device:e,width:n,height:t,targets:r}=this.resources,a=256*Math.ceil(4*n/256),o=a*t,i=e.createBuffer({size:o,usage:GPUBufferUsage.COPY_DST|GPUBufferUsage.MAP_READ}),s=e.createCommandEncoder();s.copyTextureToBuffer({texture:r[0].texture},{buffer:i,bytesPerRow:a},{width:n,height:t}),e.queue.submit([s.finish()]),await i.mapAsync(GPUMapMode.READ);const l=new Uint8Array(i.getMappedRange()),u=new Uint8ClampedArray(n*t*4);for(let e=0;e<t;e++){const t=e*a,r=e*n*4;u.set(l.subarray(t,t+4*n),r)}return i.unmap(),i.destroy(),new ImageData(u,n,t)}dispose(){this.disposeResources(),this.device=null,this.initialized=!1}getShaderSource(e){return e}createPipeline(e,n,t,r=!0,a=!1){const o=[{binding:0,visibility:GPUShaderStage.FRAGMENT,texture:{sampleType:"float"}},{binding:1,visibility:GPUShaderStage.FRAGMENT,sampler:{type:"filtering"}}];r&&o.push({binding:2,visibility:GPUShaderStage.FRAGMENT,buffer:{type:"uniform"}}),a&&o.push({binding:2,visibility:GPUShaderStage.FRAGMENT,texture:{sampleType:"float"}},{binding:3,visibility:GPUShaderStage.FRAGMENT,sampler:{type:"filtering"}});const i=e.createBindGroupLayout({entries:o}),s=e.createPipelineLayout({bindGroupLayouts:[i]}),l=e.createShaderModule({code:this.getShaderSource("\nstruct VertexOutput {\n @builtin(position) position: vec4<f32>,\n @location(0) uv: vec2<f32>,\n}\n\n@vertex\nfn main(@location(0) position: vec2<f32>, @location(1) uv: vec2<f32>) -> VertexOutput {\n var output: VertexOutput;\n output.position = vec4<f32>(position, 0.0, 1.0);\n output.uv = uv;\n return output;\n}\n")}),u=e.createShaderModule({code:this.getShaderSource(t)});return{pipeline:e.createRenderPipeline({layout:s,vertex:{module:l,entryPoint:"main",buffers:[{arrayStride:16,attributes:[{shaderLocation:0,offset:0,format:"float32x2"},{shaderLocation:1,offset:8,format:"float32x2"}]}]},fragment:{module:u,entryPoint:"main",targets:[{format:n}]},primitive:{topology:"triangle-strip"}}),bindGroupLayout:i}}createRenderTarget(e,n,t,r){const a=e.createTexture({size:{width:n,height:t},format:r,usage:GPUTextureUsage.TEXTURE_BINDING|GPUTextureUsage.RENDER_ATTACHMENT|GPUTextureUsage.COPY_SRC});return{texture:a,view:a.createView()}}initResources(e,n,t,r){const a=this.canvas.getContext("webgpu");if(!a)throw new Error("Failed to get WebGPU context");const o=navigator.gpu.getPreferredCanvasFormat();a.configure({device:e,format:o,alphaMode:"opaque"});const i=e.createTexture({size:{width:n,height:t},format:"rgba8unorm",usage:GPUTextureUsage.TEXTURE_BINDING|GPUTextureUsage.COPY_DST|GPUTextureUsage.RENDER_ATTACHMENT}),s=document.createElement("canvas");s.width=n,s.height=t;const l=s.getContext("2d");l.drawImage(r,0,0);const u=l.getImageData(0,0,n,t);e.queue.writeTexture({texture:i},u.data,{bytesPerRow:4*n},{width:n,height:t}),this.setupResources(e,a,o,n,t,i)}initResourcesFromImageData(e,n,t,r){const a=this.canvas.getContext("webgpu");if(!a)throw new Error("Failed to get WebGPU context");const o=navigator.gpu.getPreferredCanvasFormat();a.configure({device:e,format:o,alphaMode:"opaque"});const i=e.createTexture({size:{width:n,height:t},format:"rgba8unorm",usage:GPUTextureUsage.TEXTURE_BINDING|GPUTextureUsage.COPY_DST|GPUTextureUsage.RENDER_ATTACHMENT});e.queue.writeTexture({texture:i},r.data,{bytesPerRow:4*n},{width:n,height:t}),this.setupResources(e,a,o,n,t,i)}setupResources(e,n,t,r,a,o){const i=e.createSampler({magFilter:"linear",minFilter:"linear",addressModeU:"clamp-to-edge",addressModeV:"clamp-to-edge"}),s=new Float32Array([-1,-1,0,1,1,-1,1,1,-1,1,0,0,1,1,1,0]),l=e.createBuffer({size:s.byteLength,usage:GPUBufferUsage.VERTEX|GPUBufferUsage.COPY_DST});e.queue.writeBuffer(l,0,s);const u="rgba8unorm",c={pass:this.createPipeline(e,t,"\n@group(0) @binding(0) var uTexture: texture_2d<f32>;\n@group(0) @binding(1) var uSampler: sampler;\n\n@fragment\nfn main(@location(0) uv: vec2<f32>) -> @location(0) vec4<f32> {\n return textureSample(uTexture, uSampler, uv);\n}\n",!1),vibrance:this.createPipeline(e,u,"\nstruct Params {\n amount: f32,\n}\n\n@group(0) @binding(0) var uTexture: texture_2d<f32>;\n@group(0) @binding(1) var uSampler: sampler;\n@group(0) @binding(2) var<uniform> params: Params;\n\n@fragment\nfn main(@location(0) uv: vec2<f32>) -> @location(0) vec4<f32> {\n let col = textureSample(uTexture, uSampler, uv);\n var color = col.rgb;\n let luminance = color.r * 0.299 + color.g * 0.587 + color.b * 0.114;\n let mn = min(min(color.r, color.g), color.b);\n let mx = max(max(color.r, color.g), color.b);\n let sat = (1.0 - (mx - mn)) * (1.0 - mx) * luminance * 5.0;\n let lightness = vec3<f32>((mn + mx) / 2.0);\n color = mix(color, mix(color, lightness, -params.amount), sat);\n return vec4<f32>(\n mix(color, lightness, (1.0 - lightness) * (1.0 - params.amount) / 2.0 * abs(params.amount)),\n col.a\n );\n}\n"),saturation:this.createPipeline(e,u,v),temperature:this.createPipeline(e,u,"\nstruct Params {\n amount: f32,\n}\n\n@group(0) @binding(0) var uTexture: texture_2d<f32>;\n@group(0) @binding(1) var uSampler: sampler;\n@group(0) @binding(2) var<uniform> params: Params;\n\n@fragment\nfn main(@location(0) uv: vec2<f32>) -> @location(0) vec4<f32> {\n var color = textureSample(uTexture, uSampler, uv);\n color.r = clamp(color.r + params.amount, 0.0, 1.0);\n color.b = clamp(color.b - params.amount, 0.0, 1.0);\n return color;\n}\n"),tint:this.createPipeline(e,u,"\nstruct Params {\n amount: f32,\n}\n\n@group(0) @binding(0) var uTexture: texture_2d<f32>;\n@group(0) @binding(1) var uSampler: sampler;\n@group(0) @binding(2) var<uniform> params: Params;\n\n@fragment\nfn main(@location(0) uv: vec2<f32>) -> @location(0) vec4<f32> {\n var color = textureSample(uTexture, uSampler, uv);\n color.g = clamp(color.g + params.amount, 0.0, 1.0);\n return color;\n}\n"),hue:this.createPipeline(e,u,"\nstruct Params {\n rotation: f32,\n}\n\n@group(0) @binding(0) var uTexture: texture_2d<f32>;\n@group(0) @binding(1) var uSampler: sampler;\n@group(0) @binding(2) var<uniform> params: Params;\n\nfn rgb2hsv(c: vec3<f32>) -> vec3<f32> {\n let K = vec4<f32>(0.0, -1.0 / 3.0, 2.0 / 3.0, -1.0);\n let p = mix(vec4<f32>(c.bg, K.wz), vec4<f32>(c.gb, K.xy), vec4<f32>(step(c.b, c.g)));\n let q = mix(vec4<f32>(p.xyw, c.r), vec4<f32>(c.r, p.yzx), vec4<f32>(step(p.x, c.r)));\n let d = q.x - min(q.w, q.y);\n let e = 1.0e-10;\n return vec3<f32>(abs(q.z + (q.w - q.y) / (6.0 * d + e)), d / (q.x + e), q.x);\n}\n\nfn hsv2rgb(c: vec3<f32>) -> vec3<f32> {\n let K = vec4<f32>(1.0, 2.0 / 3.0, 1.0 / 3.0, 3.0);\n let p = abs(fract(c.xxx + K.xyz) * 6.0 - K.www);\n return c.z * mix(K.xxx, clamp(p - K.xxx, vec3<f32>(0.0), vec3<f32>(1.0)), c.y);\n}\n\n@fragment\nfn main(@location(0) uv: vec2<f32>) -> @location(0) vec4<f32> {\n let base = textureSample(uTexture, uSampler, uv);\n var hsv = rgb2hsv(base.rgb);\n hsv.x = fract(hsv.x + params.rotation);\n return vec4<f32>(hsv2rgb(hsv), base.a);\n}\n"),brightness:this.createPipeline(e,u,"\nstruct Params {\n amount: f32,\n}\n\n@group(0) @binding(0) var uTexture: texture_2d<f32>;\n@group(0) @binding(1) var uSampler: sampler;\n@group(0) @binding(2) var<uniform> params: Params;\n\nconst PI: f32 = 3.1415926535897932384626433832795;\n\n@fragment\nfn main(@location(0) uv: vec2<f32>) -> @location(0) vec4<f32> {\n var color = textureSample(uTexture, uSampler, uv);\n if (params.amount >= 0.0) {\n color.r = color.r + params.amount * sin(color.r * PI);\n color.g = color.g + params.amount * sin(color.g * PI);\n color.b = color.b + params.amount * sin(color.b * PI);\n } else {\n color.r = (1.0 + params.amount) * color.r;\n color.g = (1.0 + params.amount) * color.g;\n color.b = (1.0 + params.amount) * color.b;\n }\n return color;\n}\n"),exposure:this.createPipeline(e,u,"\nstruct Params {\n amount: f32,\n}\n\n@group(0) @binding(0) var uTexture: texture_2d<f32>;\n@group(0) @binding(1) var uSampler: sampler;\n@group(0) @binding(2) var<uniform> params: Params;\n\nconst epsilon: f32 = 0.000001;\nconst mx: f32 = 1.0 - 0.000001;\n\n// GLSL mat3 列主序: mat3(col0_elem0, col0_elem1, col0_elem2, col1_elem0, ...)\n// WGSL mat3x3 也是列主序: mat3x3(vec3_col0, vec3_col1, vec3_col2)\nconst matRGBtoROMM = mat3x3<f32>(\n vec3<f32>(0.5293459296226501, 0.3300727903842926, 0.14058130979537964), // 第一列\n vec3<f32>(0.09837432950735092, 0.8734610080718994, 0.028164653107523918), // 第二列\n vec3<f32>(0.01688321679830551, 0.11767247319221497, 0.8654443025588989) // 第三列\n);\n\nconst matROMMtoRGB = mat3x3<f32>(\n vec3<f32>(2.0340757369995117, -0.727334201335907, -0.3067416846752167), // 第一列\n vec3<f32>(-0.22881317138671875, 1.2317301034927368, -0.0029169507324695587), // 第二列\n vec3<f32>(-0.008569774217903614, -0.1532866358757019, 1.1618564128875732) // 第三列\n);\n\nfn rgb2hsv(c: vec3<f32>) -> vec3<f32> {\n let K = vec4<f32>(0.0, -1.0 / 3.0, 2.0 / 3.0, -1.0);\n let p = mix(vec4<f32>(c.bg, K.wz), vec4<f32>(c.gb, K.xy), vec4<f32>(step(c.b, c.g)));\n let q = mix(vec4<f32>(p.xyw, c.r), vec4<f32>(c.r, p.yzx), vec4<f32>(step(p.x, c.r)));\n let d = q.x - min(q.w, q.y);\n let e = 1.0e-10;\n return vec3<f32>(abs(q.z + (q.w - q.y) / (6.0 * d + e)), d / (q.x + e), q.x);\n}\n\nfn hsv2rgb(c: vec3<f32>) -> vec3<f32> {\n let K = vec4<f32>(1.0, 2.0 / 3.0, 1.0 / 3.0, 3.0);\n let p = abs(fract(c.xxx + K.xyz) * 6.0 - K.www);\n return c.z * mix(K.xxx, clamp(p - K.xxx, vec3<f32>(0.0), vec3<f32>(1.0)), c.y);\n}\n\nfn setHue(res: vec3<f32>, base: vec3<f32>) -> vec3<f32> {\n let hsv = rgb2hsv(base);\n let res_hsv = rgb2hsv(res);\n return hsv2rgb(vec3<f32>(hsv.x, res_hsv.y, res_hsv.z));\n}\n\nfn ramp(t_in: f32) -> f32 {\n var t = t_in * 2.0;\n if (t >= 1.0) {\n t = t - 1.0;\n t = log(0.5) / log(0.5 * (1.0 - t) + 0.9332 * t);\n }\n return clamp(t, 0.001, 10.0);\n}\n\n@fragment\nfn main(@location(0) uv: vec2<f32>) -> @location(0) vec4<f32> {\n let col = textureSample(uTexture, uSampler, uv);\n var base = col.rgb * matRGBtoROMM;\n let a = abs(params.amount) * col.a + epsilon;\n let v = pow(2.0, a * 2.0 + 1.0) - 2.0;\n let m = mx - exp(-v);\n var res: vec3<f32>;\n if (params.amount > 0.0) {\n res = (1.0 - exp(-v * base)) / m;\n } else {\n res = log(1.0 - base * m) / -v;\n }\n res = mix(base, res, min(a * 100.0, 1.0));\n res = setHue(res, base);\n res = pow(res, vec3<f32>(ramp(1.0 - (0.0 * col.a + 1.0) / 2.0)));\n res = res * matROMMtoRGB;\n return vec4<f32>(res, col.a);\n}\n"),contrast:this.createPipeline(e,u,f),blacks:this.createPipeline(e,u,"\n@group(0) @binding(0) var uTexture: texture_2d<f32>;\n@group(0) @binding(1) var uSampler: sampler;\n@group(0) @binding(2) var uPaletteMap: texture_2d<f32>;\n@group(0) @binding(3) var uPaletteSampler: sampler;\n\n@fragment\nfn main(@location(0) uv: vec2<f32>) -> @location(0) vec4<f32> {\n let base = textureSample(uTexture, uSampler, uv);\n let r = textureSample(uPaletteMap, uPaletteSampler, vec2<f32>(base.r, 0.0)).r;\n let g = textureSample(uPaletteMap, uPaletteSampler, vec2<f32>(base.g, 0.0)).g;\n let b = textureSample(uPaletteMap, uPaletteSampler, vec2<f32>(base.b, 0.0)).b;\n return vec4<f32>(r, g, b, base.a);\n}\n",!1,!0),whites:this.createPipeline(e,u,"\nstruct Params {\n amount: f32,\n}\n\n@group(0) @binding(0) var uTexture: texture_2d<f32>;\n@group(0) @binding(1) var uSampler: sampler;\n@group(0) @binding(2) var<uniform> params: Params;\n\nconst RGB2Y = vec3<f32>(0.2126, 0.7152, 0.0722);\n\n@fragment\nfn main(@location(0) uv: vec2<f32>) -> @location(0) vec4<f32> {\n let base = textureSample(uTexture, uSampler, uv);\n var color = base.rgb;\n let lum = dot(color, RGB2Y);\n let whiteMask = smoothstep(0.5, 1.0, lum);\n color = color + params.amount * whiteMask;\n return vec4<f32>(clamp(color, vec3<f32>(0.0), vec3<f32>(1.0)), base.a);\n}\n"),highlights:this.createPipeline(e,u,"\nstruct Params {\n amount: f32,\n}\n\n@group(0) @binding(0) var uTexture: texture_2d<f32>;\n@group(0) @binding(1) var uSampler: sampler;\n@group(0) @binding(2) var<uniform> params: Params;\n\nconst epsilon: f32 = 0.000001;\nconst mx: f32 = 1.0 - 0.000001;\n\nconst matRGBtoROMM = mat3x3<f32>(\n vec3<f32>(0.5293459296226501, 0.3300727903842926, 0.14058130979537964),\n vec3<f32>(0.09837432950735092, 0.8734610080718994, 0.028164653107523918),\n vec3<f32>(0.01688321679830551, 0.11767247319221497, 0.8654443025588989)\n);\n\nconst matROMMtoRGB = mat3x3<f32>(\n vec3<f32>(2.0340757369995117, -0.727334201335907, -0.3067416846752167),\n vec3<f32>(-0.22881317138671875, 1.2317301034927368, -0.0029169507324695587),\n vec3<f32>(-0.008569774217903614, -0.1532866358757019, 1.1618564128875732)\n);\n\nfn luma_romm(color: vec3<f32>) -> f32 {\n return dot(color, vec3<f32>(0.242655, 0.755158, 0.002187));\n}\n\nfn rgb2hsv(c: vec3<f32>) -> vec3<f32> {\n let K = vec4<f32>(0.0, -1.0 / 3.0, 2.0 / 3.0, -1.0);\n let p = mix(vec4<f32>(c.bg, K.wz), vec4<f32>(c.gb, K.xy), vec4<f32>(step(c.b, c.g)));\n let q = mix(vec4<f32>(p.xyw, c.r), vec4<f32>(c.r, p.yzx), vec4<f32>(step(p.x, c.r)));\n let d = q.x - min(q.w, q.y);\n let e = 1.0e-10;\n return vec3<f32>(abs(q.z + (q.w - q.y) / (6.0 * d + e)), d / (q.x + e), q.x);\n}\n\nfn hsv2rgb(c: vec3<f32>) -> vec3<f32> {\n let K = vec4<f32>(1.0, 2.0 / 3.0, 1.0 / 3.0, 3.0);\n let p = abs(fract(c.xxx + K.xyz) * 6.0 - K.www);\n return c.z * mix(K.xxx, clamp(p - K.xxx, vec3<f32>(0.0), vec3<f32>(1.0)), c.y);\n}\n\nfn setHue(res: vec3<f32>, base: vec3<f32>) -> vec3<f32> {\n let hsv = rgb2hsv(base);\n let res_hsv = rgb2hsv(res);\n return hsv2rgb(vec3<f32>(hsv.x, res_hsv.y, res_hsv.z));\n}\n\n@fragment\nfn main(@location(0) uv: vec2<f32>) -> @location(0) vec4<f32> {\n let col = textureSample(uTexture, uSampler, uv);\n let map = col.rgb;\n var base = col.rgb * matRGBtoROMM;\n let map_lum = luma_romm(map * matRGBtoROMM);\n let exposure = mix(params.amount, 0.0, 1.0 - map_lum) * col.a;\n let a = abs(exposure) * col.a + epsilon;\n let v = pow(2.0, a + 1.0) - 2.0;\n let m = mx - exp(-v);\n var res: vec3<f32>;\n if (exposure > 0.0) {\n res = (1.0 - exp(-v * base)) / m;\n } else {\n res = log(1.0 - base * m) / -v;\n }\n res = mix(base, res, min(a * 100.0, 1.0));\n res = setHue(res, base);\n res = res * matROMMtoRGB;\n return vec4<f32>(res, col.a);\n}\n"),shadows:this.createPipeline(e,u,"\nstruct Params {\n amount: f32,\n}\n\n@group(0) @binding(0) var uTexture: texture_2d<f32>;\n@group(0) @binding(1) var uSampler: sampler;\n@group(0) @binding(2) var<uniform> params: Params;\n\nconst epsilon: f32 = 0.000001;\nconst mx: f32 = 1.0 - 0.000001;\n\nconst matRGBtoROMM = mat3x3<f32>(\n vec3<f32>(0.5293459296226501, 0.3300727903842926, 0.14058130979537964),\n vec3<f32>(0.09837432950735092, 0.8734610080718994, 0.028164653107523918),\n vec3<f32>(0.01688321679830551, 0.11767247319221497, 0.8654443025588989)\n);\n\nconst matROMMtoRGB = mat3x3<f32>(\n vec3<f32>(2.0340757369995117, -0.727334201335907, -0.3067416846752167),\n vec3<f32>(-0.22881317138671875, 1.2317301034927368, -0.0029169507324695587),\n vec3<f32>(-0.008569774217903614, -0.1532866358757019, 1.1618564128875732)\n);\n\nfn luma_romm(color: vec3<f32>) -> f32 {\n return dot(color, vec3<f32>(0.242655, 0.755158, 0.002187));\n}\n\nfn rgb2hsv(c: vec3<f32>) -> vec3<f32> {\n let K = vec4<f32>(0.0, -1.0 / 3.0, 2.0 / 3.0, -1.0);\n let p = mix(vec4<f32>(c.bg, K.wz), vec4<f32>(c.gb, K.xy), vec4<f32>(step(c.b, c.g)));\n let q = mix(vec4<f32>(p.xyw, c.r), vec4<f32>(c.r, p.yzx), vec4<f32>(step(p.x, c.r)));\n let d = q.x - min(q.w, q.y);\n let e = 1.0e-10;\n return vec3<f32>(abs(q.z + (q.w - q.y) / (6.0 * d + e)), d / (q.x + e), q.x);\n}\n\nfn hsv2rgb(c: vec3<f32>) -> vec3<f32> {\n let K = vec4<f32>(1.0, 2.0 / 3.0, 1.0 / 3.0, 3.0);\n let p = abs(fract(c.xxx + K.xyz) * 6.0 - K.www);\n return c.z * mix(K.xxx, clamp(p - K.xxx, vec3<f32>(0.0), vec3<f32>(1.0)), c.y);\n}\n\nfn setHue(res: vec3<f32>, base: vec3<f32>) -> vec3<f32> {\n let hsv = rgb2hsv(base);\n let res_hsv = rgb2hsv(res);\n return hsv2rgb(vec3<f32>(hsv.x, res_hsv.y, res_hsv.z));\n}\n\n@fragment\nfn main(@location(0) uv: vec2<f32>) -> @location(0) vec4<f32> {\n let col = textureSample(uTexture, uSampler, uv);\n let map = col.rgb;\n var base = col.rgb * matRGBtoROMM;\n let map_lum = luma_romm(map * matRGBtoROMM);\n let exposure = mix(0.0, params.amount, 1.0 - map_lum) * col.a;\n let a = abs(exposure) * col.a + epsilon;\n let v = pow(2.0, a + 1.0) - 2.0;\n let m = mx - exp(-v);\n var res: vec3<f32>;\n if (exposure > 0.0) {\n res = (1.0 - exp(-v * base)) / m;\n } else {\n res = log(1.0 - base * m) / -v;\n }\n res = mix(base, res, min(a * 100.0, 1.0));\n res = setHue(res, base);\n res = res * matROMMtoRGB;\n return vec4<f32>(res, col.a);\n}\n"),dehaze:this.createPipeline(e,u,"\nstruct Params {\n amount: f32,\n width: f32,\n height: f32,\n _pad: f32,\n}\n\n@group(0) @binding(0) var uTexture: texture_2d<f32>;\n@group(0) @binding(1) var uSampler: sampler;\n@group(0) @binding(2) var<uniform> params: Params;\n\nfn hazeMap(coord: vec2<f32>) -> f32 {\n var color = vec3<f32>(1.0);\n let stepSize = vec2<f32>(1.0 / params.width, 1.0 / params.height);\n for (var i: i32 = -1; i <= 1; i = i + 1) {\n for (var j: i32 = -1; j <= 1; j = j + 1) {\n let offset = vec2<f32>(f32(i), f32(j)) * stepSize;\n let uv = clamp(coord + offset, vec2<f32>(0.0), vec2<f32>(1.0));\n let sample = textureSample(uTexture, uSampler, uv).rgb;\n color = min(color, sample);\n }\n }\n return min(color.r, min(color.g, color.b));\n}\n\n@fragment\nfn main(@location(0) uv: vec2<f32>) -> @location(0) vec4<f32> {\n let base = textureSample(uTexture, uSampler, uv);\n let haze = hazeMap(uv);\n let transmission = 1.0 - 0.95 * haze;\n let A = 0.95;\n let t0 = 0.1;\n let t = mix(1.0, max(t0, transmission), params.amount);\n let J = (base.rgb - A) / t + A;\n return vec4<f32>(J, base.a);\n}\n"),bloom:this.createPipeline(e,u,"\nstruct Params {\n amount: f32,\n texelX: f32,\n texelY: f32,\n threshold: f32,\n}\n\n@group(0) @binding(0) var uTexture: texture_2d<f32>;\n@group(0) @binding(1) var uSampler: sampler;\n@group(0) @binding(2) var<uniform> params: Params;\n\n@fragment\nfn main(@location(0) uv: vec2<f32>) -> @location(0) vec4<f32> {\n var sum = vec4<f32>(0.0);\n let texel = vec2<f32>(params.texelX, params.texelY);\n \n for (var j: i32 = -2; j <= 2; j = j + 1) {\n for (var i: i32 = -2; i <= 2; i = i + 1) {\n sum = sum + textureSample(uTexture, uSampler, uv + vec2<f32>(f32(i), f32(j)) * texel);\n }\n }\n sum = sum / 25.0;\n \n var base = textureSample(uTexture, uSampler, uv);\n if (length(sum.rgb) > params.threshold) {\n base = base + sum * params.amount;\n }\n return base;\n}\n"),glamour:this.createPipeline(e,u,"\nstruct Params {\n amount: f32,\n texelX: f32,\n texelY: f32,\n _pad: f32,\n}\n\n@group(0) @binding(0) var uTexture: texture_2d<f32>;\n@group(0) @binding(1) var uSampler: sampler;\n@group(0) @binding(2) var<uniform> params: Params;\n\nfn normpdf(x: f32, sigma: f32) -> f32 {\n return 0.39894 * exp(-0.5 * x * x / (sigma * sigma)) / sigma;\n}\n\nfn luma(color: vec3<f32>) -> f32 {\n return dot(color, vec3<f32>(0.299, 0.587, 0.114));\n}\n\n@fragment\nfn main(@location(0) uv: vec2<f32>) -> @location(0) vec4<f32> {\n let texel = vec2<f32>(params.texelX, params.texelY);\n let sigma = 7.0;\n var final_colour = vec3<f32>(0.0);\n var Z = 0.0;\n \n // 简化版高斯模糊\n for (var i: i32 = -5; i <= 5; i = i + 1) {\n for (var j: i32 = -5; j <= 5; j = j + 1) {\n let weight = normpdf(f32(i), sigma) * normpdf(f32(j), sigma);\n final_colour = final_colour + weight * textureSample(uTexture, uSampler, uv + vec2<f32>(f32(i), f32(j)) * texel).rgb;\n Z = Z + weight;\n }\n }\n final_colour = final_colour / Z;\n \n let base = textureSample(uTexture, uSampler, uv);\n var color = vec3<f32>(luma(final_colour));\n \n // Soft light blend\n color = vec3<f32>(\n select(1.0 - 2.0 * (1.0 - base.r) * (1.0 - color.r), 2.0 * base.r * color.r, base.r <= 0.5),\n select(1.0 - 2.0 * (1.0 - base.g) * (1.0 - color.g), 2.0 * base.g * color.g, base.g <= 0.5),\n select(1.0 - 2.0 * (1.0 - base.b) * (1.0 - color.b), 2.0 * base.b * color.b, base.b <= 0.5)\n );\n \n return mix(base, vec4<f32>(color, base.a), params.amount);\n}\n"),clarity:this.createPipeline(e,u,"\nstruct Params {\n amount: f32,\n texelX: f32,\n texelY: f32,\n _pad: f32,\n}\n\n@group(0) @binding(0) var uTexture: texture_2d<f32>;\n@group(0) @binding(1) var uSampler: sampler;\n@group(0) @binding(2) var<uniform> params: Params;\n\nfn Lum(c: vec3<f32>) -> f32 {\n return 0.299 * c.r + 0.587 * c.g + 0.114 * c.b;\n}\n\nfn BlendOverlayf(base: f32, blend: f32) -> f32 {\n return select(1.0 - 2.0 * (1.0 - base) * (1.0 - blend), 2.0 * base * blend, base < 0.5);\n}\n\nfn BlendOverlay(base: vec3<f32>, blend: vec3<f32>) -> vec3<f32> {\n return vec3<f32>(BlendOverlayf(base.r, blend.r), BlendOverlayf(base.g, blend.g), BlendOverlayf(base.b, blend.b));\n}\n\nfn BlendVividLightf(base: f32, blend: f32) -> f32 {\n let BlendColorBurnf = select(max(1.0 - ((1.0 - base) / (2.0 * blend)), 0.0), 2.0 * blend, (2.0 * blend) == 0.0);\n let BlendColorDodgef = select(min(base / (1.0 - (2.0 * (blend - 0.5))), 1.0), 2.0 * (blend - 0.5), (2.0 * (blend - 0.5)) == 1.0);\n return select(BlendColorDodgef, BlendColorBurnf, blend < 0.5);\n}\n\nfn BlendVividLight(base: vec3<f32>, blend: vec3<f32>) -> vec3<f32> {\n return vec3<f32>(BlendVividLightf(base.r, blend.r), BlendVividLightf(base.g, blend.g), BlendVividLightf(base.b, blend.b));\n}\n\nfn normpdf(x: f32, sigma: f32) -> f32 {\n return 0.39894 * exp(-0.5 * x * x / (sigma * sigma)) / sigma;\n}\n\n@fragment\nfn main(@location(0) uv: vec2<f32>) -> @location(0) vec4<f32> {\n let texel = vec2<f32>(params.texelX, params.texelY);\n let sigma = 7.0;\n var blur = vec3<f32>(0.0);\n var Z = 0.0;\n \n for (var i: i32 = -5; i <= 5; i = i + 1) {\n for (var j: i32 = -5; j <= 5; j = j + 1) {\n let weight = normpdf(f32(i), sigma) * normpdf(f32(j), sigma);\n blur = blur + weight * textureSample(uTexture, uSampler, uv + vec2<f32>(f32(i), f32(j)) * texel).rgb;\n Z = Z + weight;\n }\n }\n blur = blur / Z;\n \n let base4 = textureSample(uTexture, uSampler, uv);\n let base = base4.rgb;\n var intensity = params.amount;\n if (params.amount < 0.0) {\n intensity = params.amount / 2.0;\n }\n \n let lum = Lum(base);\n let col = vec3<f32>(lum);\n let mask = vec3<f32>(1.0 - pow(lum, 1.8));\n let layer = vec3<f32>(1.0 - Lum(blur));\n let detail = clamp(BlendVividLight(col, layer), vec3<f32>(0.0), vec3<f32>(1.0));\n let inverse = mix(1.0 - detail, detail, (intensity + 1.0) / 2.0);\n \n return vec4<f32>(BlendOverlay(base, mix(vec3<f32>(0.5), inverse, mask)), base4.a);\n}\n"),kernel:this.createPipeline(e,u,"\nstruct Params {\n texelX: f32,\n texelY: f32,\n amount: f32,\n _pad: f32,\n kernel: array<f32, 12>, // 9 + 3 padding\n}\n\n@group(0) @binding(0) var uTexture: texture_2d<f32>;\n@group(0) @binding(1) var uSampler: sampler;\n@group(0) @binding(2) var<uniform> params: Params;\n\n@fragment\nfn main(@location(0) uv: vec2<f32>) -> @location(0) vec4<f32> {\n let texel = vec2<f32>(params.texelX, params.texelY);\n \n let c11 = textureSample(uTexture, uSampler, uv - texel);\n let c12 = textureSample(uTexture, uSampler, vec2<f32>(uv.x, uv.y - texel.y));\n let c13 = textureSample(uTexture, uSampler, vec2<f32>(uv.x + texel.x, uv.y - texel.y));\n let c21 = textureSample(uTexture, uSampler, vec2<f32>(uv.x - texel.x, uv.y));\n let c22 = textureSample(uTexture, uSampler, uv);\n let c23 = textureSample(uTexture, uSampler, vec2<f32>(uv.x + texel.x, uv.y));\n let c31 = textureSample(uTexture, uSampler, vec2<f32>(uv.x - texel.x, uv.y + texel.y));\n let c32 = textureSample(uTexture, uSampler, vec2<f32>(uv.x, uv.y + texel.y));\n let c33 = textureSample(uTexture, uSampler, uv + texel);\n \n let color = c11 * params.kernel[0] + c12 * params.kernel[1] + c13 * params.kernel[2] +\n c21 * params.kernel[3] + c22 * params.kernel[4] + c23 * params.kernel[5] +\n c31 * params.kernel[6] + c32 * params.kernel[7] + c33 * params.kernel[8];\n \n return color * params.amount + (c22 * (1.0 - params.amount));\n}\n"),blur:this.createPipeline(e,u,"\nstruct Params {\n sizeX: f32,\n sizeY: f32,\n _pad1: f32,\n _pad2: f32,\n}\n\n@group(0) @binding(0) var uTexture: texture_2d<f32>;\n@group(0) @binding(1) var uSampler: sampler;\n@group(0) @binding(2) var<uniform> params: Params;\n\nfn random(scale: vec3<f32>, seed: f32, coord: vec3<f32>) -> f32 {\n return fract(sin(dot(coord + seed, scale)) * 43758.5453 + seed);\n}\n\n@fragment\nfn main(@location(0) uv: vec2<f32>, @builtin(position) fragCoord: vec4<f32>) -> @location(0) vec4<f32> {\n var color = vec4<f32>(0.0);\n var total = 0.0;\n let size = vec2<f32>(params.sizeX, params.sizeY);\n let offset = random(vec3<f32>(12.9898, 78.233, 151.7182), 0.0, fragCoord.xyz);\n \n for (var t: i32 = -30; t <= 30; t = t + 1) {\n let percent = (f32(t) + offset - 0.5) / 30.0;\n let weight = 1.0 - abs(percent);\n var sample = textureSample(uTexture, uSampler, uv + size * percent);\n sample = vec4<f32>(sample.rgb * sample.a, sample.a);\n color = color + sample * weight;\n total = total + weight;\n }\n \n color = color / total;\n return vec4<f32>(color.rgb / (color.a + 0.00001), color.a);\n}\n"),vignette:this.createPipeline(e,u,"\nstruct Params {\n amount: f32,\n size: f32,\n _pad1: f32,\n _pad2: f32,\n}\n\n@group(0) @binding(0) var uTexture: texture_2d<f32>;\n@group(0) @binding(1) var uSampler: sampler;\n@group(0) @binding(2) var<uniform> params: Params;\n\n@fragment\nfn main(@location(0) uv: vec2<f32>) -> @location(0) vec4<f32> {\n var color = textureSample(uTexture, uSampler, uv);\n let dist = distance(uv, vec2<f32>(0.5, 0.5));\n let amt = clamp(params.amount, -1.0, 1.0);\n let edge = dist * (abs(amt) * 0.75 + params.size * 2.0);\n var vignette = smoothstep(0.8, params.size * 0.799, edge);\n \n if (amt < 0.0) {\n vignette = 1.0 + (1.0 - vignette) * (-amt);\n } else {\n vignette = mix(1.0, vignette, amt);\n }\n \n color = vec4<f32>(color.rgb * vignette, color.a);\n return color;\n}\n"),grain:this.createPipeline(e,u,"\nstruct Params {\n width: f32,\n height: f32,\n amount: f32,\n time: f32,\n}\n\n@group(0) @binding(0) var uTexture: texture_2d<f32>;\n@group(0) @binding(1) var uSampler: sampler;\n@group(0) @binding(2) var<uniform> params: Params;\n\nfn rnm(tc: vec2<f32>) -> vec4<f32> {\n let noise = sin(dot(tc + vec2<f32>(params.time), vec2<f32>(12.9898, 78.233))) * 43758.5453;\n return vec4<f32>(\n fract(noise) * 2.0 - 1.0,\n fract(noise * 1.2154) * 2.0 - 1.0,\n fract(noise * 1.3453) * 2.0 - 1.0,\n fract(noise * 1.3647) * 2.0 - 1.0\n );\n}\n\nfn fade(t: f32) -> f32 {\n return t * t * t * (t * (t * 6.0 - 15.0) + 10.0);\n}\n\n@fragment\nfn main(@location(0) uv: vec2<f32>) -> @location(0) vec4<f32> {\n let grainsize = 1.8;\n let lumamount = 1.0;\n \n let rotCoordsR = uv;\n let noiseScale = vec2<f32>(params.width / grainsize, params.height / grainsize);\n let noise = vec3<f32>(rnm(rotCoordsR * noiseScale).rgb);\n \n let tex = textureSample(uTexture, uSampler, uv);\n var col = tex.rgb;\n let lumcoeff = vec3<f32>(0.299, 0.587, 0.114);\n let luminance = mix(0.0, dot(col, lumcoeff), lumamount);\n var lum = smoothstep(0.2, 0.0, luminance);\n lum = lum + luminance;\n let finalNoise = mix(noise, vec3<f32>(0.0), pow(lum, 4.0));\n col = col + finalNoise * params.amount;\n \n return vec4<f32>(col, tex.a);\n}\n")},m=e.createTexture({size:{width:256,height:1},format:"rgba8unorm",usage:GPUTextureUsage.TEXTURE_BINDING|GPUTextureUsage.COPY_DST}),x=[this.createRenderTarget(e,r,a,"rgba8unorm"),this.createRenderTarget(e,r,a,"rgba8unorm")];this.resources={device:e,context:n,format:t,width:r,height:a,sourceTexture:o,sourceTextureView:o.createView(),sampler:i,vertexBuffer:l,pipelines:c,targets:x,paletteTexture:m,paletteTextureView:m.createView()}}disposeResources(){if(!this.resources)return;const{sourceTexture:e,vertexBuffer:n,targets:t,paletteTexture:r}=this.resources;e.destroy(),n.destroy(),t.forEach(e=>e.texture.destroy()),r&&r.destroy(),this.resources=null}createUniformBuffer(e,n){const t=e.createBuffer({size:Math.max(n.byteLength,16),usage:GPUBufferUsage.UNIFORM|GPUBufferUsage.COPY_DST});return e.queue.writeBuffer(t,0,n),t}drawFrame(e,n){const{device:t,context:r,width:a,height:o,sourceTextureView:i,sampler:s,vertexBuffer:l,pipelines:u,targets:c,paletteTexture:m,paletteTextureView:v}=e;let f=i,g=0;const h=()=>{const e=c[g%2];return g++,e},b=(e,n,r)=>{const a=u[e];if(!a)return;const o=r?null:h(),i=r||o.view,c=[{binding:0,resource:f},{binding:1,resource:s}];let m=null;n&&(m=this.createUniformBuffer(t,n),c.push({binding:2,resource:{buffer:m}}));const v=t.createBindGroup({layout:a.bindGroupLayout,entries:c}),x=t.createCommandEncoder(),p=x.beginRenderPass({colorAttachments:[{view:i,loadOp:"clear",storeOp:"store",clearValue:{r:0,g:0,b:0,a:1}}]});p.setPipeline(a.pipeline),p.setVertexBuffer(0,l),p.setBindGroup(0,v),p.draw(4),p.end(),t.queue.submit([x.finish()]),o&&(f=o.view),m&&m.destroy()};if(Math.abs(n.vibrance)>.5&&b("vibrance",new Float32Array([n.vibrance/100]).buffer),Math.abs(n.saturation)>.5&&b("saturation",(e=>{const n=1+Math.max(-100,Math.min(100,e))/100,t=.299,r=.587,a=.114,o=1-n;return new Float32Array([o*t+n,o*r,o*a,0,0,o*t,o*r+n,o*a,0,0,o*t,o*r,o*a+n,0,0,0,0,0,1,0])})(n.saturation).buffer),Math.abs(n.temperature)>.5&&b("temperature",new Float32Array([n.temperature/500]).buffer),Math.abs(n.tint)>.5&&b("tint",new Float32Array([n.tint/500]).buffer),Math.abs(n.hue)>.5&&b("hue",new Float32Array([n.hue/200]).buffer),b("brightness",new Float32Array([n.brightness/200]).buffer),Math.abs(n.exposure)>.5&&b("exposure",new Float32Array([n.exposure/100]).buffer),Math.abs(n.contrast)>.5&&b("contrast",(e=>{const n=1+Math.max(-100,Math.min(100,e))/100,t=.5*(1-n);return new Float32Array([n,0,0,0,t,0,n,0,0,t,0,0,n,0,t,0,0,0,1,0])})(n.contrast).buffer),Math.abs(n.blacks)>.5&&m&&v){const e=(e=>{const n=Math.max(-100,Math.min(100,e))/100;return(e=>{const n=new Uint8Array(768);for(let t=0;t<256;t+=1){const r=p(t/255,0,e,.66,1),a=Math.round(255*x(r)),o=3*t;n[o]=a,n[o+1]=a,n[o+2]=a}return n})(x(.33-.35*n))})(n.blacks),r=new Uint8Array(1024);for(let n=0;n<256;n++)r[4*n]=e[3*n],r[4*n+1]=e[3*n+1],r[4*n+2]=e[3*n+2],r[4*n+3]=255;t.queue.writeTexture({texture:m},r,{bytesPerRow:1024},{width:256,height:1});const a=u.blacks,o=h(),i=o.view,c=t.createBindGroup({layout:a.bindGroupLayout,entries:[{binding:0,resource:f},{binding:1,resource:s},{binding:2,resource:v},{binding:3,resource:s}]}),g=t.createCommandEncoder(),b=g.beginRenderPass({colorAttachments:[{view:i,loadOp:"clear",storeOp:"store",clearValue:{r:0,g:0,b:0,a:1}}]});b.setPipeline(a.pipeline),b.setVertexBuffer(0,l),b.setBindGroup(0,c),b.draw(4),b.end(),t.queue.submit([g.finish()]),f=o.view}if(Math.abs(n.whites)>.5&&b("whites",new Float32Array([n.whites/400]).buffer),Math.abs(n.highlights)>.5&&b("highlights",new Float32Array([n.highlights/100]).buffer),Math.abs(n.shadows)>.5&&b("shadows",new Float32Array([n.shadows/100]).buffer),Math.abs(n.dehaze)>.5&&b("dehaze",new Float32Array([n.dehaze/100,a,o,0]).buffer),n.bloom>.5&&b("bloom",new Float32Array([n.bloom/100,1/a,1/o,.5]).buffer),n.glamour>.5&&b("glamour",new Float32Array([n.glamour/100,1/a,1/o,0]).buffer),Math.abs(n.clarity)>.5&&b("clarity",new Float32Array([n.clarity/100,1/a,1/o,0]).buffer),n.sharpen>.5&&b("kernel",new Float32Array([1/a,1/o,n.sharpen/100,0,0,-1,0,-1,5,-1,0,-1,0,0,0,0]).buffer),n.smooth>.5){const e=1/9;b("kernel",new Float32Array([1/a,1/o,n.smooth/100,0,e,e,e,e,e,e,e,e,e,0,0,0]).buffer)}b("blur",new Float32Array([n.blur/a,0,0,0]).buffer),b("blur",new Float32Array([0,n.blur/o,0,0]).buffer),b("vignette",new Float32Array([n.vignette/100,.25,0,0]).buffer),b("grain",new Float32Array([a,o,n.grain/800,0]).buffer),b("pass",void 0,r.getCurrentTexture().createView())}},h={vibrance:0,saturation:0,temperature:0,tint:0,hue:0,brightness:0,exposure:0,contrast:0,blacks:0,whites:0,highlights:0,shadows:0,dehaze:0,bloom:0,glamour:0,clarity:0,sharpen:0,smooth:0,blur:0,vignette:0,grain:0},b={auto:{},blackAndWhite:{saturation:-100,contrast:20,exposure:10,clarity:10},pop:{highlights:50,shadows:-50,vibrance:50,saturation:20,exposure:20,clarity:20},vintage:{saturation:-20,contrast:10,temperature:15,grain:30,vignette:25},vivid:{vibrance:40,saturation:20,contrast:15,clarity:20},cinematic:{contrast:25,highlights:-20,shadows:15,temperature:-10,vignette:30}};function d(e){const{data:n,width:t,height:r}=e,a=new Array(256).fill(0);for(let e=0;e<n.length;e+=4)a[n[e]]+=1,a[n[e+1]]+=1,a[n[e+2]]+=1;const o=Math.round(t*r/1e3);let i=0;for(let e=0;e<256;e++)if(a[e]>o){i=e;break}let s=255;for(let e=255;e>=0;e--)if(a[e]>o){s=e;break}return i>100&&(i=100),s<155&&(s=155),{black:i,white:s}}function w(e){const{data:n,width:t,height:r}=e;let a=1,o=1;for(let e=0;e<n.length;e+=4){const t=n[e],r=n[e+1],i=n[e+2],s=Math.min(t,r,i),l=Math.max(t,r,i);o+=l/255;const u=l-s;u>0&&(a+=u/l)}return(a+o)/(t*r*2)}function y(e){return{levels:d(e),vibrance:w(e)}}exports.BaseBackend=e,exports.ImageColorGrading=class{constructor(e={}){this.backend=null,this.settings={...h},this.imageLoaded=!1,this.initPromise=null,this.canvas=e.canvas||document.createElement("canvas"),this.backendType=r(e.backend)}getCanvas(){return this.canvas}getBackendType(){return this.backendType}static isWebGPUSupported(){return n()}static isWebGLSupported(){return t()}getSettings(){return{...this.settings}}setSettings(e){this.settings={...this.settings,...e},this.backend&&this.imageLoaded&&this.render()}resetSettings(){this.settings={...h},this.backend&&this.imageLoaded&&this.render()}async initBackend(){if(this.backend)return;const e={};if("webgpu"===this.backendType){this.backend=new g(this.canvas,e);try{await this.backend.init()}catch(n){this.backend=new m(this.canvas,e),this.backend.init(),this.backendType="webgl"}}else this.backend=new m(this.canvas,e),this.backend.init()}async ensureBackend(){this.initPromise||(this.initPromise=this.initBackend()),await this.initPromise}async loadImage(e){return await this.ensureBackend(),new Promise((n,t)=>{const r=new Image;r.crossOrigin="anonymous",r.onload=()=>{this.backend.loadFromImage(r),this.imageLoaded=!0,this.render(),n()},r.onerror=()=>{t(new Error(`Failed to load image: ${e}`))},r.src=e})}async loadFromImage(e){await this.ensureBackend(),this.backend.loadFromImage(e),this.imageLoaded=!0,this.render()}async loadFromFile(e){const n=URL.createObjectURL(e);try{await this.loadImage(n)}finally{URL.revokeObjectURL(n)}}async loadFromImageData(e){await this.ensureBackend(),this.backend.loadFromImageData(e),this.imageLoaded=!0,this.render()}render(){this.backend&&this.imageLoaded&&this.backend.render(this.settings)}toDataURL(e){this.render();const n=e?.format||"image/png",t=e?.quality;return this.canvas.toDataURL(n,t)}toBlob(e){return this.render(),new Promise((n,t)=>{const r=e?.format||"image/png",a=e?.quality;this.canvas.toBlob(e=>{e?n(e):t(new Error("Failed to create blob"))},r,a)})}getImageData(){if(!this.backend)throw new Error("No backend initialized");return this.render(),this.backend.getImageData()}getSize(){return this.backend?this.backend.getSize():{width:0,height:0}}isLoaded(){return this.imageLoaded}dispose(){this.backend&&(this.backend.dispose(),this.backend=null),this.imageLoaded=!1,this.initPromise=null}analyze(){if(!this.imageLoaded||!this.backend)throw new Error("No image loaded");const e={...this.settings};this.settings={...h},this.render();const n=y(this.getImageData());return this.settings=e,this.render(),n}autoFix(){if(!this.imageLoaded||!this.backend)throw new Error("No image loaded");this.settings={...h},this.render();const e=this.getImageData(),n=d(e),t=w(e),r={...h};if(r.whites=Math.round(255-n.white),r.blacks=Math.round(n.black),t<.7){const e=Math.round(100*(.7-t));r.vibrance=Math.min(e,50)}return this.settings=r,this.render(),r}applyPreset(e){if("auto"===e)return this.autoFix();const n=b[e],t={...h,...n};return this.settings=t,this.backend&&this.imageLoaded&&this.render(),t}},exports.WebGLBackend=m,exports.WebGPUBackend=g,exports.analyzeImage=y,exports.analyzeImageLevels=d,exports.analyzeImageVibrance=w,exports.defaultSettings=h,exports.isWebGLSupported=t,exports.isWebGPUSupported=n,exports.presets=b,exports.selectBestBackend=r;
|