import {
  category as asciiBarsCategory,
  draw as asciiBars,
  params as asciiBarsParams,
  preview as asciiBarsPreview,
} from "./ascii/bars.ts";
import {
  category as barsCategory,
  draw as bars,
  params as barsParams,
  preview as barsPreview,
} from "./classic/bars.ts";
import {
  category as cdbottomCategory,
  draw as cdbottom,
  params as cdbottomParams,
  preview as cdbottomPreview,
} from "./media/cd-bottom.ts";
import {
  category as cdtopCategory,
  draw as cdtop,
  params as cdtopParams,
  preview as cdtopPreview,
} from "./media/cd-top.ts";
import {
  category as cdflipCategory,
  draw as cdflip,
  params as cdflipParams,
  preview as cdflipPreview,
} from "./media/cd-flip.ts";
export type VisualizerName = keyof typeof visualizers;

// visualizer opts registry, bundles draw & params
export type VisualizerOptions = Record<
  string,
  string | number | HTMLImageElement
>;

export type VisualizerDef = {
  draw: (
    canvas: HTMLCanvasElement,
    freq: Uint8Array,
    options: VisualizerOptions,
    dt?: number,
  ) => void;
  preview: (
    canvas: HTMLCanvasElement,
    freq: Uint8Array,
    getOptions: () => VisualizerOptions,
    fps: number,
  ) => () => void;
  params: Array<{
    key: string;
    type: string;
    default: string | number;
    min?: number;
    max?: number;
    step?: number;
    values?: string[];
    label: string;
    inputStyle?: Partial<CSSStyleDeclaration>;
  }>;
  category: string;
  audioReactive: boolean;
  default?: boolean;
};

export const visualizers: Record<string, VisualizerDef> = {
  ascii_bars: {
    draw: asciiBars,
    params: asciiBarsParams,
    preview: asciiBarsPreview,
    category: asciiBarsCategory,
    audioReactive: true,
  },
  bars: {
    draw: bars,
    params: barsParams,
    preview: barsPreview,
    category: barsCategory,
    audioReactive: true,
  },
  cd_bottom: {
    draw: cdbottom,
    params: cdbottomParams,
    preview: cdbottomPreview,
    category: cdbottomCategory,
    audioReactive: false,
  },
  cd_top: {
    draw: cdtop,
    params: cdtopParams,
    preview: cdtopPreview,
    category: cdtopCategory,
    audioReactive: false,
  },
  cd_flip: {
    draw: cdflip,
    params: cdflipParams,
    preview: cdflipPreview,
    category: cdflipCategory,
    audioReactive: false,
    default: true,
  },
};
