diff --git a/js/leibovitz/balance.js b/js/leibovitz/balance.js
index 5cdf630..b489a62 100644
--- a/js/leibovitz/balance.js
+++ b/js/leibovitz/balance.js
@@ -10,7 +10,7 @@
* - Observer Pattern: For state management and effect application
* - Factory Pattern: For UI initialization
* - Strategy Pattern: For temperature adjustment algorithm
- * - Static Class Pattern: For state management
+ * - Command Pattern: For state reset operations
*
* @algorithm
* White balance adjustment process:
@@ -26,49 +26,63 @@
* - Real-time updates
*/
-class BalanceManager {
+const BalanceManager = {
+ // Private state
+ _observers: new Set(),
+ _slider: null,
+ _value: null,
+
/**
* Initializes the balance manager and sets up UI controls
* Implements the Factory pattern for UI initialization
*/
- static init() {
- this.balanceSlider = document.getElementById('balance-slider');
- this.balanceValue = document.getElementById('balance-value');
+ init() {
+ this._slider = document.getElementById('balance-slider');
+ this._value = document.getElementById('balance-value');
this._setupEventListeners();
- }
+ },
/**
* Sets up event listeners for UI controls
* Implements the Observer pattern for state changes
*/
- static _setupEventListeners() {
- this.balanceSlider.addEventListener('input', () => {
- const value = this.balanceSlider.value;
- this.balanceValue.textContent = `${value}K`;
+ _setupEventListeners() {
+ this._slider.addEventListener('input', () => {
+ const value = this._slider.value;
+ this._value.textContent = `${value}K`;
+ this._notifyObservers();
});
- }
+ },
+
+ _notifyObservers() {
+ this._observers.forEach(observer => observer(this.getCurrentBalance()));
+ },
+
+ /**
+ * Subscribes to balance 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);
+ },
/**
* Gets the current white balance temperature
* @returns {number} Current temperature in Kelvin (2000K-10000K)
*/
- static getCurrentBalance() {
- return parseInt(this.balanceSlider.value);
- }
+ getCurrentBalance() {
+ return parseInt(this._slider.value);
+ },
/**
* Applies white balance adjustment to an image
* Implements temperature-based RGB channel scaling with non-linear response
* @param {ImageData} imageData - Source image data
* @returns {ImageData} White balanced image data
- *
- * Algorithm:
- * 1. Convert temperature to ratio relative to neutral (6500K)
- * 2. Apply non-linear scaling (0.2 factor) to red and blue channels
- * 3. Warmer temps (<6500K) increase red, decrease blue
- * 4. Cooler temps (>6500K) increase blue, decrease red
*/
- static applyBalance(imageData) {
+ applyBalance(imageData) {
const balance = this.getCurrentBalance();
if (!balance || balance === 6500) return imageData; // 6500K is neutral
@@ -84,5 +98,15 @@ class BalanceManager {
}
return imageData;
+ },
+
+ /**
+ * Resets balance effect to default state
+ * Implements the Command pattern for state reset
+ */
+ reset() {
+ this._slider.value = 6500;
+ this._value.textContent = '6500K';
+ this._notifyObservers();
}
-}
\ No newline at end of file
+};
\ No newline at end of file
|