@radialapps/memories-vips-editor 0.1.2 → 0.1.5

package/src/transforms/shadows.ts

@@ -0,0 +1,67 @@
+// shadows.ts — lift/crush the dark end, weighted by darkness.
+//
+// weight w = (1 - clamp(avg,0,1))^2 (1 in blacks, 0 in whites, quadratic
+// falloff), then rgb += (amount * 0.5) * w. The 0.5 keeps the gray curve
+// monotonic over the whole slider range (a full-strength lift would reverse
+// deep shadows past mid-gray). Same formula in src/transforms/shadows.h
+// and math.ts applyShadows, so the canvas preview is WYSIWYG.
+import { clampf } from '../math.js';
+import {
+  isNumInRange,
+  setFloatUniform,
+  type ParamControl,
+  type RenderContext,
+  type Target,
+  type Transform,
+} from './transform.js';
+
+export interface ShadowsEdit {
+  edit: 'shadows';
+  /** -1 (crush shadows) .. 1 (lift shadows). Default 0. */
+  amount?: number;
+}
+
+type Full = Required<ShadowsEdit>;
+
+const FRAG = `
+precision mediump float;
+uniform sampler2D texture;
+uniform float amount;
+varying vec2 texCoord;
+void main() {
+  vec4 color = texture2D(texture, texCoord);
+  float avg = (color.r + color.g + color.b) / 3.0;
+  float l = clamp(avg, 0.0, 1.0);
+  float w = (1.0 - l) * (1.0 - l);
+  color.rgb += (amount * 0.5) * w;
+  gl_FragColor = color;
+}
+`;
+
+export class ShadowsTransform implements Transform<'shadows', ShadowsEdit> {
+  public readonly edit = 'shadows' as const;
+  public controls: ParamControl[] = [
+    { key: 'amount', label: 'amount', min: -1, max: 1, step: 0.01, def: 0 },
+  ];
+
+  public defaults(): Full {
+    return { edit: 'shadows', amount: 0 };
+  }
+
+  public validate(params: ShadowsEdit): string[] {
+    if (params.amount !== undefined && !isNumInRange(params.amount, -1, 1))
+      return ['amount must be a number in [-1,1]'];
+    return [];
+  }
+
+  public normalize(params: ShadowsEdit): Full {
+    return { edit: 'shadows', amount: clampf(-1, params.amount ?? 0, 1) };
+  }
+
+  public apply(ctx: RenderContext, from: Target, to: Target, params: Full): Target {
+    ctx.pass(FRAG, from, to, (gl, p) => {
+      setFloatUniform(gl, p, 'amount', params.amount);
+    });
+    return to;
+  }
+}

package/src/transforms/sharpen.ts

@@ -28,7 +28,7 @@ varying vec2 texCoord;
 void main() {
   vec4 blurred = texture2D(blurredTexture, texCoord);
   vec4 original = texture2D(originalTexture, texCoord);
-  gl_FragColor = mix(blurred, original, 1.0 + strength);
+  gl_FragColor = vec4(mix(blurred.rgb, original.rgb, 1.0 + strength), original.a);
 }
 `;
 

package/src/transforms/state.ts

@@ -1,23 +1,20 @@
 // transforms/state.ts — {version, edits} state validation/serialization.
-import type { EditState } from '../types.js';
+import { EDIT_STATE_VERSION, type EditState } from '../types.js';
 import { normalizeEdit, validateEdit } from './index.js';
 
 export function validateState(state: EditState): string[] {
-  const errs: string[] = [];
   if (typeof state !== 'object' || state === null) return ['state must be an object'];
-  if ((state as EditState).version !== 1) errs.push('version must be 1');
-  if (!Array.isArray((state as EditState).edits)) {
-    errs.push('edits must be an array');
-    return errs;
-  }
-  (state as EditState).edits.forEach((edit, i) => {
+  const errs: string[] = [];
+  if (state.version !== EDIT_STATE_VERSION) errs.push(`version must be ${EDIT_STATE_VERSION}`);
+  if (!Array.isArray(state.edits)) return [...errs, 'edits must be an array'];
+  state.edits.forEach((edit, i) => {
     for (const e of validateEdit(edit)) errs.push(`edits[${i}]: ${e}`);
   });
   return errs;
 }
 
 export function stateToJSON(state: EditState): string {
-  return JSON.stringify({ version: 1, edits: state.edits.map(normalizeEdit) });
+  return JSON.stringify({ version: EDIT_STATE_VERSION, edits: state.edits.map(normalizeEdit) });
 }
 
 /** Parse + normalize; throws on invalid shape. */
@@ -25,5 +22,5 @@ export function stateFromJSON(json: string): EditState {
   const raw = JSON.parse(json) as EditState;
   const errs = validateState(raw);
   if (errs.length > 0) throw new Error(`invalid edit state: ${errs.join('; ')}`);
-  return { version: 1, edits: raw.edits.map(normalizeEdit) };
+  return { version: EDIT_STATE_VERSION, edits: raw.edits.map(normalizeEdit) };
 }

package/src/transforms/transform.ts

@@ -3,8 +3,8 @@
 // A transform is one named pixel edit (brightnessContrast, sepia, ...).
 // The pipeline (pipeline.ts) stays generic: it looks the transform up by
 // `edit.edit` in the registry (transforms/index.ts), normalizes params
-// through it, and calls apply(). The VIPS side mirrors this shape with an
-// `Edit` base class plus one header per transform (src/edits/).
+// through it, and calls apply(). The VIPS side mirrors this shape with a
+// `Transform` base class plus one header per transform (src/transforms/).
 import type { EditName } from '../types.js';
 
 export interface Target {
@@ -92,10 +92,13 @@ export function setFloatUniform(
   if (u) gl.uniform1f(u, value);
 }
 
-/** Lookup helper: unknown runtime names yield undefined (guarded by callers). */
+/** Unknown runtime names (including Object.prototype keys) yield undefined. */
 export function lookup(
   registry: Record<EditName, Transform<string, object>>,
-  name: string,
+  name: unknown,
 ): Transform<string, object> | undefined {
-  return (registry as Record<string, Transform<string, object> | undefined>)[name];
+  if (typeof name !== 'string' || !Object.prototype.hasOwnProperty.call(registry, name)) {
+    return undefined;
+  }
+  return registry[name as EditName];
 }

package/src/transforms/warmth.ts

@@ -0,0 +1,64 @@
+// warmth.ts — white-balance-style temperature shift (red/blue gains).
+//
+// r *= 1 + 0.3*amount, b *= 1 - 0.3*amount, g unchanged: +1 is warm
+// (amber), -1 is cool (blue). Blacks stay black (multiplicative, like a
+// white-balance gain). Same factors in src/transforms/warmth.h and
+// math.ts warmthGains, so the canvas preview is WYSIWYG.
+import { clampf } from '../math.js';
+import {
+  isNumInRange,
+  setFloatUniform,
+  type ParamControl,
+  type RenderContext,
+  type Target,
+  type Transform,
+} from './transform.js';
+
+export interface WarmthEdit {
+  edit: 'warmth';
+  /** -1 (cool) .. 1 (warm). Default 0. */
+  amount?: number;
+}
+
+type Full = Required<WarmthEdit>;
+
+const FRAG = `
+precision mediump float;
+uniform sampler2D texture;
+uniform float amount;
+varying vec2 texCoord;
+void main() {
+  vec4 color = texture2D(texture, texCoord);
+  color.r *= 1.0 + amount * 0.3;
+  color.b *= 1.0 - amount * 0.3;
+  gl_FragColor = color;
+}
+`;
+
+export class WarmthTransform implements Transform<'warmth', WarmthEdit> {
+  public readonly edit = 'warmth' as const;
+  public controls: ParamControl[] = [
+    { key: 'amount', label: 'amount', min: -1, max: 1, step: 0.01, def: 0 },
+  ];
+
+  public defaults(): Full {
+    return { edit: 'warmth', amount: 0 };
+  }
+
+  public validate(params: WarmthEdit): string[] {
+    if (params.amount !== undefined && !isNumInRange(params.amount, -1, 1))
+      return ['amount must be a number in [-1,1]'];
+    return [];
+  }
+
+  public normalize(params: WarmthEdit): Full {
+    return { edit: 'warmth', amount: clampf(-1, params.amount ?? 0, 1) };
+  }
+
+  public apply(ctx: RenderContext, from: Target, to: Target, params: Full): Target {
+    ctx.pass(FRAG, from, to, (gl, p) => {
+      setFloatUniform(gl, p, 'amount', params.amount);
+    });
+    return to;
+  }
+}

package/src/types.ts

@@ -10,13 +10,16 @@ import type { BrightnessContrastEdit } from './transforms/brightnessContrast.js'
 import type { CropEdit } from './transforms/crop.js';
 import type { ExposureEdit } from './transforms/exposure.js';
 import type { GrayscaleEdit } from './transforms/grayscale.js';
+import type { HighlightsEdit } from './transforms/highlights.js';
 import type { HueSaturationEdit } from './transforms/hueSaturation.js';
 import type { InvertEdit } from './transforms/invert.js';
 import type { RotateEdit } from './transforms/rotate.js';
 import type { SepiaEdit } from './transforms/sepia.js';
+import type { ShadowsEdit } from './transforms/shadows.js';
 import type { SharpenEdit } from './transforms/sharpen.js';
 import type { VibranceEdit } from './transforms/vibrance.js';
 import type { VignetteEdit } from './transforms/vignette.js';
+import type { WarmthEdit } from './transforms/warmth.js';
 
 export type EditName =
   | 'brightnessContrast'
@@ -27,6 +30,9 @@ export type EditName =
   | 'blur'
   | 'sharpen'
   | 'vignette'
+  | 'shadows'
+  | 'highlights'
+  | 'warmth'
   | 'invert'
   | 'grayscale'
   | 'crop'
@@ -41,6 +47,9 @@ export type Edit =
   | BlurEdit
   | SharpenEdit
   | VignetteEdit
+  | ShadowsEdit
+  | HighlightsEdit
+  | WarmthEdit
   | InvertEdit
   | GrayscaleEdit
   | CropEdit