@twick/visualizer 0.14.0 → 0.14.3

package/src/helpers/filters.ts

@@ -1,128 +1,128 @@
-import { Reference } from "@twick/core";
-import { COLOR_FILTERS } from "./constants";
-
-/**
- * Filter utilities for the visualizer package.
- * Provides functions for applying various visual filters to elements.
- */
-
-/**
- * Applies a blur filter to an element
- * @param {Object} params - Parameters for the blur filter
- * @param {Reference<any>} params.element - The element to apply the filter to
- * @param {number} params.amount - The blur amount
- * @returns {void}
- */
-export function applyBlurFilter({ element, amount }: { element: Reference<any>; amount: number }) {
-  // ... existing code ...
-}
-
-/**
- * Applies a brightness filter to an element
- * @param {Object} params - Parameters for the brightness filter
- * @param {Reference<any>} params.element - The element to apply the filter to
- * @param {number} params.amount - The brightness amount
- * @returns {void}
- */
-export function applyBrightnessFilter({ element, amount }: { element: Reference<any>; amount: number }) {
-  // ... existing code ...
-}
-
-/**
- * Applies a contrast filter to an element
- * @param {Object} params - Parameters for the contrast filter
- * @param {Reference<any>} params.element - The element to apply the filter to
- * @param {number} params.amount - The contrast amount
- * @returns {void}
- */
-export function applyContrastFilter({ element, amount }: { element: Reference<any>; amount: number }) {
-  // ... existing code ...
-}
-
-export const applyColorFilter = (ref: Reference<any>, filterType: string) => {
-    switch (filterType) {
-      case COLOR_FILTERS.SATURATED:
-        ref().filters.saturate(1.4);
-        ref().filters.contrast(1.1);
-        break;
-      case COLOR_FILTERS.BRIGHT:
-        ref().filters.brightness(1.3);
-        ref().filters.contrast(1.05);
-        break;
-      case COLOR_FILTERS.VIBRANT:
-        ref().filters.saturate(1.6);
-        ref().filters.brightness(1.15);
-        ref().filters.contrast(1.1);
-        break;
-      case COLOR_FILTERS.RETRO:
-        ref().filters.sepia(0.8);
-        ref().filters.contrast(1.3);
-        ref().filters.brightness(0.85);
-        ref().filters.saturate(0.8);
-        break;
-      case COLOR_FILTERS.BLACK_WHITE:
-        ref().filters.grayscale(1);
-        ref().filters.contrast(1.25);
-        ref().filters.brightness(1.05);
-        break;
-      case COLOR_FILTERS.COOL:
-        ref().filters.hue(15);
-        ref().filters.brightness(1.1);
-        ref().filters.saturate(1.3);
-        ref().filters.contrast(1.05);
-        break;
-      case COLOR_FILTERS.WARM:
-        ref().filters.hue(-15);
-        ref().filters.brightness(1.15);
-        ref().filters.saturate(1.3);
-        ref().filters.contrast(1.05);
-        break;
-      case COLOR_FILTERS.CINEMATIC:
-        ref().filters.contrast(1.4);
-        ref().filters.brightness(0.95);
-        ref().filters.saturate(0.85);
-        ref().filters.sepia(0.2);
-        break;
-      case COLOR_FILTERS.SOFT_GLOW:
-        ref().filters.brightness(1.2);
-        ref().filters.contrast(0.95);
-        ref().filters.blur(1.2);
-        ref().filters.saturate(1.1);
-        break;
-      case COLOR_FILTERS.MOODY:
-        ref().filters.brightness(1.05);
-        ref().filters.contrast(1.4);
-        ref().filters.saturate(0.65);
-        ref().filters.sepia(0.2);
-        break;
-      case COLOR_FILTERS.DREAMY:
-        ref().filters.brightness(1.3);
-        ref().filters.blur(2);
-        ref().filters.saturate(1.4);
-        ref().filters.contrast(0.95);
-        break;
-      case COLOR_FILTERS.INVERTED:
-        ref().filters.invert(1);
-        ref().filters.hue(180);
-        break;
-      case COLOR_FILTERS.VINTAGE:
-        ref().filters.sepia(0.4);
-        ref().filters.saturate(1.4);
-        ref().filters.contrast(1.2);
-        ref().filters.brightness(1.1);
-        break;
-      case COLOR_FILTERS.DRAMATIC:
-        ref().filters.contrast(1.5);
-        ref().filters.brightness(0.9);
-        ref().filters.saturate(1.2);
-        break;
-      case COLOR_FILTERS.FADED:
-        ref().filters.opacity(0.9);
-        ref().filters.brightness(1.2);
-        ref().filters.saturate(0.8);
-        ref().filters.contrast(0.9);
-        break;
-      default:
-        break;
-    }
+import { Reference } from "@twick/core";
+import { COLOR_FILTERS } from "./constants";
+
+/**
+ * Filter utilities for the visualizer package.
+ * Provides functions for applying various visual filters to elements.
+ */
+
+/**
+ * Applies a blur filter to an element
+ * @param {Object} params - Parameters for the blur filter
+ * @param {Reference<any>} params.element - The element to apply the filter to
+ * @param {number} params.amount - The blur amount
+ * @returns {void}
+ */
+export function applyBlurFilter({ element, amount }: { element: Reference<any>; amount: number }) {
+  // ... existing code ...
+}
+
+/**
+ * Applies a brightness filter to an element
+ * @param {Object} params - Parameters for the brightness filter
+ * @param {Reference<any>} params.element - The element to apply the filter to
+ * @param {number} params.amount - The brightness amount
+ * @returns {void}
+ */
+export function applyBrightnessFilter({ element, amount }: { element: Reference<any>; amount: number }) {
+  // ... existing code ...
+}
+
+/**
+ * Applies a contrast filter to an element
+ * @param {Object} params - Parameters for the contrast filter
+ * @param {Reference<any>} params.element - The element to apply the filter to
+ * @param {number} params.amount - The contrast amount
+ * @returns {void}
+ */
+export function applyContrastFilter({ element, amount }: { element: Reference<any>; amount: number }) {
+  // ... existing code ...
+}
+
+export const applyColorFilter = (ref: Reference<any>, filterType: string) => {
+    switch (filterType) {
+      case COLOR_FILTERS.SATURATED:
+        ref().filters.saturate(1.4);
+        ref().filters.contrast(1.1);
+        break;
+      case COLOR_FILTERS.BRIGHT:
+        ref().filters.brightness(1.3);
+        ref().filters.contrast(1.05);
+        break;
+      case COLOR_FILTERS.VIBRANT:
+        ref().filters.saturate(1.6);
+        ref().filters.brightness(1.15);
+        ref().filters.contrast(1.1);
+        break;
+      case COLOR_FILTERS.RETRO:
+        ref().filters.sepia(0.8);
+        ref().filters.contrast(1.3);
+        ref().filters.brightness(0.85);
+        ref().filters.saturate(0.8);
+        break;
+      case COLOR_FILTERS.BLACK_WHITE:
+        ref().filters.grayscale(1);
+        ref().filters.contrast(1.25);
+        ref().filters.brightness(1.05);
+        break;
+      case COLOR_FILTERS.COOL:
+        ref().filters.hue(15);
+        ref().filters.brightness(1.1);
+        ref().filters.saturate(1.3);
+        ref().filters.contrast(1.05);
+        break;
+      case COLOR_FILTERS.WARM:
+        ref().filters.hue(-15);
+        ref().filters.brightness(1.15);
+        ref().filters.saturate(1.3);
+        ref().filters.contrast(1.05);
+        break;
+      case COLOR_FILTERS.CINEMATIC:
+        ref().filters.contrast(1.4);
+        ref().filters.brightness(0.95);
+        ref().filters.saturate(0.85);
+        ref().filters.sepia(0.2);
+        break;
+      case COLOR_FILTERS.SOFT_GLOW:
+        ref().filters.brightness(1.2);
+        ref().filters.contrast(0.95);
+        ref().filters.blur(1.2);
+        ref().filters.saturate(1.1);
+        break;
+      case COLOR_FILTERS.MOODY:
+        ref().filters.brightness(1.05);
+        ref().filters.contrast(1.4);
+        ref().filters.saturate(0.65);
+        ref().filters.sepia(0.2);
+        break;
+      case COLOR_FILTERS.DREAMY:
+        ref().filters.brightness(1.3);
+        ref().filters.blur(2);
+        ref().filters.saturate(1.4);
+        ref().filters.contrast(0.95);
+        break;
+      case COLOR_FILTERS.INVERTED:
+        ref().filters.invert(1);
+        ref().filters.hue(180);
+        break;
+      case COLOR_FILTERS.VINTAGE:
+        ref().filters.sepia(0.4);
+        ref().filters.saturate(1.4);
+        ref().filters.contrast(1.2);
+        ref().filters.brightness(1.1);
+        break;
+      case COLOR_FILTERS.DRAMATIC:
+        ref().filters.contrast(1.5);
+        ref().filters.brightness(0.9);
+        ref().filters.saturate(1.2);
+        break;
+      case COLOR_FILTERS.FADED:
+        ref().filters.opacity(0.9);
+        ref().filters.brightness(1.2);
+        ref().filters.saturate(0.8);
+        ref().filters.contrast(0.9);
+        break;
+      default:
+        break;
+    }
   };

package/src/helpers/log.utils.ts

@@ -1,29 +1,55 @@
-import { format } from "date-fns";
-
-const getCurrentTime = (dateFormat = "mm:ss:SSS") => {
-  const now = new Date();
-  return format(now, dateFormat);
-};
-
-/**
- * Logging utilities for the visualizer package.
- * Provides consistent logging functionality across the application.
- */
-
-/**
- * Logs a message to the console with a visualizer prefix
- * @param {string} message - The message to log
- * @param {any} [data] - Optional data to log
- */
-export function logger(message: string, data?: any) {
-  console.log(`[Visualizer] ${message}`, data ? data : "");
-}
-
-/**
- * Logs an error to the console with a visualizer prefix
- * @param {string} message - The error message to log
- * @param {Error} [error] - Optional error object
- */
-export function errorLogger(message: string, error?: Error) {
-  console.error(`[Visualizer Error] ${message}`, error ? error : "");
-}
+import { format } from "date-fns";
+
+/**
+ * Gets the current time formatted according to the specified format.
+ * Uses date-fns to format the current timestamp.
+ *
+ * @param dateFormat - The date format string to use
+ * @returns Formatted time string
+ * 
+ * @example
+ * ```js
+ * const time = getCurrentTime("mm:ss:SSS");
+ * // time = "05:30:123"
+ * ```
+ */
+const getCurrentTime = (dateFormat = "mm:ss:SSS") => {
+  const now = new Date();
+  return format(now, dateFormat);
+};
+
+/**
+ * Logs a message to the console with a visualizer prefix.
+ * Provides consistent logging functionality across the application
+ * with standardized formatting and prefixing.
+ *
+ * @param message - The message to log
+ * @param data - Optional data to log
+ * 
+ * @example
+ * ```js
+ * logger("Scene loaded successfully", { sceneId: "scene1" });
+ * // Output: [Visualizer] Scene loaded successfully { sceneId: "scene1" }
+ * ```
+ */
+export function logger(message: string, data?: any) {
+  console.log(`[Visualizer] ${message}`, data ? data : "");
+}
+
+/**
+ * Logs an error to the console with a visualizer prefix.
+ * Provides consistent error logging functionality across the application
+ * with standardized formatting and prefixing.
+ *
+ * @param message - The error message to log
+ * @param error - Optional error object
+ * 
+ * @example
+ * ```js
+ * errorLogger("Failed to load scene", new Error("Network error"));
+ * // Output: [Visualizer Error] Failed to load scene Error: Network error
+ * ```
+ */
+export function errorLogger(message: string, error?: Error) {
+  console.error(`[Visualizer Error] ${message}`, error ? error : "");
+}

package/src/helpers/timing.utils.ts

@@ -1,110 +1,110 @@
-import {
-  linear,
-  easeInSine,
-  easeOutSine,
-  easeInOutSine,
-  easeInQuad,
-  easeOutQuad,
-  easeInOutQuad,
-  easeInCubic,
-  easeOutCubic,
-  easeInOutCubic,
-  easeInQuart,
-  easeOutQuart,
-  easeInOutQuart,
-  easeInQuint,
-  easeOutQuint,
-  easeInOutQuint,
-  easeInExpo,
-  easeOutExpo,
-  easeInOutExpo,
-  easeInCirc,
-  easeOutCirc,
-  easeInOutCirc,
-  easeInBack,
-  easeOutBack,
-  easeInOutBack,
-  easeInElastic,
-  easeOutElastic,
-  easeInOutElastic,
-  easeInBounce,
-  easeOutBounce,
-  easeInOutBounce,
-} from "@twick/core";
-
-/**
- * Timing utilities for the visualizer package.
- * Provides functions for handling timing and animation calculations.
- */
-
-/**
- * Gets the timing function based on the provided name
- * @param {string} name - Name of the timing function
- * @returns {Function} The timing function
- */
-export function getTimingFunction(name: string) {
-  switch (name) {
-    case "easeInSine":
-      return easeInSine;
-    case "easeOutSine":
-      return easeOutSine;
-    case "easeInOutSine":
-      return easeInOutSine;
-    case "easeInQuad":
-      return easeInQuad;
-    case "easeOutQuad":
-      return easeOutQuad;
-    case "easeInOutQuad":
-      return easeInOutQuad;
-    case "easeInCubic":
-      return easeInCubic;
-    case "easeOutCubic":
-      return easeOutCubic;
-    case "easeInOutCubic":
-      return easeInOutCubic;
-    case "easeInQuart":
-      return easeInQuart;
-    case "easeOutQuart":
-      return easeOutQuart;
-    case "easeInOutQuart":
-      return easeInOutQuart;
-    case "easeInQuint":
-      return easeInQuint;
-    case "easeOutQuint":
-      return easeOutQuint;
-    case "easeInOutQuint":
-      return easeInOutQuint;
-    case "easeInExpo":
-      return easeInExpo;
-    case "easeOutExpo":
-      return easeOutExpo;
-    case "easeInOutExpo":
-      return easeInOutExpo;
-    case "easeInCirc":
-      return easeInCirc;
-    case "easeOutCirc":
-      return easeOutCirc;
-    case "easeInOutCirc":
-      return easeInOutCirc;
-    case "easeInBack":
-      return easeInBack;
-    case "easeOutBack":
-      return easeOutBack;
-    case "easeInOutBack":
-      return easeInOutBack;
-    case "easeInElastic":
-      return easeInElastic;
-    case "easeOutElastic":
-      return easeOutElastic;
-    case "easeInOutElastic":
-      return easeInOutElastic;
-    case "easeInBounce":
-      return easeInBounce;
-    case "easeOutBounce":
-      return easeOutBounce;
-    case "easeInOutBounce":
-      return easeInOutBounce;
-    default:
-      return linear;
-  }
+import {
+  linear,
+  easeInSine,
+  easeOutSine,
+  easeInOutSine,
+  easeInQuad,
+  easeOutQuad,
+  easeInOutQuad,
+  easeInCubic,
+  easeOutCubic,
+  easeInOutCubic,
+  easeInQuart,
+  easeOutQuart,
+  easeInOutQuart,
+  easeInQuint,
+  easeOutQuint,
+  easeInOutQuint,
+  easeInExpo,
+  easeOutExpo,
+  easeInOutExpo,
+  easeInCirc,
+  easeOutCirc,
+  easeInOutCirc,
+  easeInBack,
+  easeOutBack,
+  easeInOutBack,
+  easeInElastic,
+  easeOutElastic,
+  easeInOutElastic,
+  easeInBounce,
+  easeOutBounce,
+  easeInOutBounce,
+} from "@twick/core";
+
+/**
+ * Timing utilities for the visualizer package.
+ * Provides functions for handling timing and animation calculations.
+ */
+
+/**
+ * Gets the timing function based on the provided name
+ * @param {string} name - Name of the timing function
+ * @returns {Function} The timing function
+ */
+export function getTimingFunction(name: string) {
+  switch (name) {
+    case "easeInSine":
+      return easeInSine;
+    case "easeOutSine":
+      return easeOutSine;
+    case "easeInOutSine":
+      return easeInOutSine;
+    case "easeInQuad":
+      return easeInQuad;
+    case "easeOutQuad":
+      return easeOutQuad;
+    case "easeInOutQuad":
+      return easeInOutQuad;
+    case "easeInCubic":
+      return easeInCubic;
+    case "easeOutCubic":
+      return easeOutCubic;
+    case "easeInOutCubic":
+      return easeInOutCubic;
+    case "easeInQuart":
+      return easeInQuart;
+    case "easeOutQuart":
+      return easeOutQuart;
+    case "easeInOutQuart":
+      return easeInOutQuart;
+    case "easeInQuint":
+      return easeInQuint;
+    case "easeOutQuint":
+      return easeOutQuint;
+    case "easeInOutQuint":
+      return easeInOutQuint;
+    case "easeInExpo":
+      return easeInExpo;
+    case "easeOutExpo":
+      return easeOutExpo;
+    case "easeInOutExpo":
+      return easeInOutExpo;
+    case "easeInCirc":
+      return easeInCirc;
+    case "easeOutCirc":
+      return easeOutCirc;
+    case "easeInOutCirc":
+      return easeInOutCirc;
+    case "easeInBack":
+      return easeInBack;
+    case "easeOutBack":
+      return easeOutBack;
+    case "easeInOutBack":
+      return easeInOutBack;
+    case "easeInElastic":
+      return easeInElastic;
+    case "easeOutElastic":
+      return easeOutElastic;
+    case "easeInOutElastic":
+      return easeInOutElastic;
+    case "easeInBounce":
+      return easeInBounce;
+    case "easeOutBounce":
+      return easeOutBounce;
+    case "easeInOutBounce":
+      return easeInOutBounce;
+    default:
+      return linear;
+  }
 }