1 files changed, 61 insertions, 11 deletions

diff --git a/js/leibovitz/color.js b/js/leibovitz/color.js
index 4319a21..1438403 100644
--- a/js/leibovitz/color.js
+++ b/js/leibovitz/color.js
@@ -1,5 +1,9 @@
-// Color tint management module
-// Uses the Observer pattern to notify the main camera module of color tint changes
+/**
+ * Color tint management module implementing HSL-based color manipulation
+ * Uses the Observer pattern for state management and effect application
+ * Implements HSL color space transformation with circular interpolation
+ * Uses noise reduction and smooth blending for quality
+ */
 
 const ColorManager = {
     // Private state
@@ -7,12 +11,18 @@ const ColorManager = {
     _observers: new Set(),
     _colorInput: null,
 
-    // Initialize the color manager
+    /**
+     * Initializes the color manager and sets up UI controls
+     * Implements the Factory pattern for UI initialization
+     */
     init() {
         this._setupEventListeners();
     },
 
-    // Private methods
+    /**
+     * Sets up event listeners for UI controls
+     * Implements the Observer pattern for state changes
+     */
     _setupEventListeners() {
         this._colorInput = document.getElementById('color-tint');
         this._colorInput.addEventListener('input', (e) => {
@@ -47,7 +57,11 @@ const ColorManager = {
         this._observers.forEach(observer => observer(this._currentColor));
     },
 
-    // Public methods
+    /**
+     * Subscribes to color state changes
+     * @param {Function} observer - Callback function for state changes
+     * @returns {Function} Unsubscribe function
+     */
     subscribe(observer) {
         this._observers.add(observer);
         return () => this._observers.delete(observer);
@@ -57,7 +71,14 @@ const ColorManager = {
         return this._currentColor;
     },
 
-    // Apply color tint to an image using a more sophisticated LUT approach
+    /**
+     * Applies color tint to an image using HSL color space
+     * Implements circular interpolation for hue blending
+     * Uses noise reduction and smooth blending for quality
+     * @param {ImageData} imageData - Source image data
+     * @param {string} color - Hex color value
+     * @returns {ImageData} Tinted image data
+     */
     applyTint(imageData, color) {
         if (!color) return imageData;
 
@@ -99,7 +120,11 @@ const ColorManager = {
         return imageData;
     },
 
-    // Helper method to convert hex color to RGB
+    /**
+     * Converts hex color to RGB values
+     * @param {string} hex - Hex color string
+     * @returns {Array} RGB values [r, g, b]
+     */
     _hexToRgb(hex) {
         const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
         return result ? [
@@ -109,7 +134,13 @@ const ColorManager = {
         ] : null;
     },
 
-    // Convert RGB to HSL
+    /**
+     * Converts RGB to HSL color space
+     * @param {number} r - Red component
+     * @param {number} g - Green component
+     * @param {number} b - Blue component
+     * @returns {Array} HSL values [h, s, l]
+     */
     _rgbToHsl(r, g, b) {
         r /= 255;
         g /= 255;
@@ -136,7 +167,13 @@ const ColorManager = {
         return [h, s, l];
     },
 
-    // Convert HSL to RGB
+    /**
+     * Converts HSL to RGB color space
+     * @param {number} h - Hue component
+     * @param {number} s - Saturation component
+     * @param {number} l - Lightness component
+     * @returns {Array} RGB values [r, g, b]
+     */
     _hslToRgb(h, s, l) {
         let r, g, b;
         
@@ -163,7 +200,13 @@ const ColorManager = {
         return [Math.round(r * 255), Math.round(g * 255), Math.round(b * 255)];
     },
 
-    // Blend two hue values (handles circular nature of hue)
+    /**
+     * Blends two hue values with circular interpolation
+     * @param {number} h1 - First hue value
+     * @param {number} h2 - Second hue value
+     * @param {number} factor - Blend factor
+     * @returns {number} Blended hue value
+     */
     _blendHue(h1, h2, factor) {
         const diff = h2 - h1;
         if (Math.abs(diff) > 0.5) {
@@ -176,7 +219,14 @@ const ColorManager = {
         return h1 + diff * factor;
     },
 
-    // Smooth blending with noise reduction
+    /**
+     * Smooth blending with noise reduction
+     * Uses cubic easing function for smooth transitions
+     * @param {number} v1 - First value
+     * @param {number} v2 - Second value
+     * @param {number} factor - Blend factor
+     * @returns {number} Blended value
+     */
     _smoothBlend(v1, v2, factor) {
         // Apply a smooth easing function
         const t = factor * factor * (3 - 2 * factor);