← back to Watches

src/config/luxury.config.js

119 lines

/**
 * Luxury Mode Configuration
 * Toggle premium features on/off
 */

export const luxuryConfig = {
  // Global luxury mode toggle
  enabled: true,

  // Feature toggles
  features: {
    // Hero section
    heroParticles: true,
    heroParallax: true,
    cinematicReveal: true,

    // Cards
    card3D: true,
    cardParallax: true,
    cardHaptic: true,
    cardShimmer: true,

    // Animations
    floatingElements: true,
    goldShimmer: true,
    pulseGlow: true,
    tickTock: true,
    priceRise: true,

    // Gestures
    swipeNavigation: true,
    keyboardNavigation: true,
    hapticFeedback: true,

    // Visual effects
    glassMorphism: true,
    backgroundEffects: true,
    particleEffects: true,
    parallaxScroll: true,

    // Loading
    premiumLoader: true,
    progressBar: true,
  },

  // Animation speeds (in seconds)
  animations: {
    float: 6,
    shimmer: 2,
    pulseGlow: 3,
    tickTock: 4,
    pageTransition: 0.6,
    cardHover: 0.4,
  },

  // Color overrides (optional)
  colors: {
    gold: '#D4AF37',
    roseGold: '#B76E79',
    platinum: '#E5E4E2',
    omegaRed: '#C8102E',
    omegaNavy: '#1A1A2E',
  },

  // Performance settings
  performance: {
    reduceMotion: false, // Automatically detect from user preferences
    gpuAcceleration: true,
    lazyLoadAnimations: true,
    debounceScroll: 50, // ms
  },

  // Typography
  typography: {
    displayFont: 'Playfair Display',
    luxuryFont: 'Cormorant Garamond',
    bodyFont: 'Montserrat',
  },

  // Effects intensity (0-1)
  intensity: {
    shadows: 1.0,
    glow: 0.8,
    blur: 1.0,
    parallax: 0.7,
  },
};

/**
 * Get feature state with fallback
 */
export const isFeatureEnabled = (feature) => {
  return luxuryConfig.enabled && luxuryConfig.features[feature];
};

/**
 * Get animation duration
 */
export const getAnimationDuration = (animation) => {
  return luxuryConfig.animations[animation] || 1;
};

/**
 * Get color value
 */
export const getLuxuryColor = (colorName) => {
  return luxuryConfig.colors[colorName] || '#D4AF37';
};

/**
 * Check if reduced motion is preferred
 */
export const shouldReduceMotion = () => {
  if (luxuryConfig.performance.reduceMotion) return true;
  return window.matchMedia('(prefers-reduced-motion: reduce)').matches;
};

export default luxuryConfig;