// Som: efeitos e trilha do kit (sintetizados no MotionCraft, pacote digital-soft). Um som por movimento, 1–2 quadros ANTES do visual.
import React from 'react';
import {Audio, Sequence, interpolate, useVideoConfig} from 'remotion';
import whooshEntra from './whoosh-entra.mp3';
import whooshSai from './whoosh-sai.mp3';
import swoosh from './swoosh.mp3';
import popPalavra from './pop-palavra.mp3';
import popCartao from './pop-cartao.mp3';
import clique from './clique.mp3';
import impacto from './impacto.mp3';
import subida from './subida.mp3';
import assinatura from './assinatura.mp3';
import tick from './tick.mp3';
import trilha from '../trilha/trilha.mp3';

export const SONS = {'whoosh-entra': whooshEntra, 'whoosh-sai': whooshSai, swoosh, 'pop-palavra': popPalavra, 'pop-cartao': popCartao, clique, impacto, subida, assinatura, tick} as const;
export type NomeSom = keyof typeof SONS;
const VOLUME: Record<NomeSom, number> = {'whoosh-entra': 0.9, 'whoosh-sai': 0.8, swoosh: 1, 'pop-palavra': 1, 'pop-cartao': 0.9, clique: 0.8, impacto: 0.9, subida: 0.7, assinatura: 0.9, tick: 0.6};

export type EfeitoProps = {som: NomeSom; em: number; volume?: number};
export const Efeito: React.FC<EfeitoProps> = ({som, em, volume}) =>
  <Sequence from={Math.max(0, Math.round(em))} durationInFrames={90} layout="none">
    <Audio src={SONS[som]} volume={volume ?? VOLUME[som]} />
  </Sequence>;

export type TrilhaProps = {volume?: number; saida?: number};
export const Trilha: React.FC<TrilhaProps> = ({volume = 0.5, saida = 20}) => {
  const {durationInFrames} = useVideoConfig();
  return <Audio src={trilha} volume={(f) => volume * interpolate(f, [durationInFrames - saida, durationInFrames], [1, 0], {extrapolateLeft: 'clamp', extrapolateRight: 'clamp'})} />;
};