// UI Layout Constants
export const UI_HEIGHTS = {
  TOP_BAR: 40,
  EDITOR_PANEL: 140,
  TOTAL_UI_HEIGHT: 180, // TOP_BAR + EDITOR_PANEL
} as const;

// Performance Constants
export const PERFORMANCE = {
  DEFAULT_TILE_SIZE: 128,
  MAX_RENDER_TIME_MS: 50,
  MAX_SHADER_TIMEOUT_MS: 5,
  TIMEOUT_CHECK_INTERVAL: 1000,
  MAX_SAVED_SHADERS: 50,
  IMAGE_DATA_CACHE_SIZE: 10,
  COMPILATION_CACHE_SIZE: 30,
} as const;

// Color Constants
export const COLOR_TABLE_SIZE = 256;

// Render Mode Constants - Keep in sync with color modes
export const RENDER_MODES = [
  'classic',
  'grayscale', 
  'red',
  'green',
  'blue',
  'rgb',
  'hsv',
  'rainbow',
  'thermal',
  'neon',
  'cyberpunk',
  'vaporwave',
  'dithered',
  'palette',
] as const;

export type RenderMode = (typeof RENDER_MODES)[number];

// Create a mapping from render mode to index for O(1) lookups
export const RENDER_MODE_INDEX: Record<string, number> = RENDER_MODES.reduce(
  (acc, mode, index) => {
    acc[mode] = index;
    return acc;
  },
  {} as Record<string, number>
);

// Storage Keys
export const STORAGE_KEYS = {
  SHADERS: 'bitfielder_shaders',
  SETTINGS: 'bitfielder_settings',
} as const;

// Value Modes
export const VALUE_MODES = [
  'integer',
  'float',
  'polar',
  'distance',
  'wave',
  'fractal',
  'cellular',
  'noise',
  'warp',
  'flow',
] as const;

export type ValueMode = (typeof VALUE_MODES)[number];

// Default Values
export const DEFAULTS = {
  RESOLUTION: 1,
  FPS: 30,
  RENDER_MODE: 'classic',
  VALUE_MODE: 'integer' as ValueMode,
  UI_OPACITY: 0.3,
  SHADER_CODE: 'x^y',
} as const;