diff --git a/src/components/DrumsView.tsx b/src/components/DrumsView.tsx index 7d191e90..10f0152e 100644 --- a/src/components/DrumsView.tsx +++ b/src/components/DrumsView.tsx @@ -8,7 +8,7 @@ import { bjorklund, rotateArray } from '../logic/bjorklund' import { TransportControls } from './TransportControls' export function DrumsView() { - const { kick, snare, hihat, hihatOpen, clap, kit, drive, setParams, setKit, setDrive } = useDrumStore() + const { kick, snare, hihat, hihatOpen, clap, kit, drive, setParams, setKit, setDrive, randomizeTechno: randomizeTechnoStore } = useDrumStore() const { drumMachine, volumes, setVolume } = useAudioStore() const updateDrum = (drum: 'kick' | 'snare' | 'hihat' | 'hihatOpen' | 'clap' | 'cowbell', params: Partial) => { @@ -30,6 +30,26 @@ export function DrumsView() { if (drumMachine) drumMachine.setSaturation(v) } + const randomizeTechno = () => { + randomizeTechnoStore() + + // Sync internal params after batch update + if (drumMachine) { + const state = useDrumStore.getState() + drumMachine.setDrumParams('kick', state.kick.pitch, state.kick.decay) + drumMachine.setDrumParams('snare', state.snare.pitch, state.snare.decay) + drumMachine.setDrumParams('hihat', state.hihat.pitch, state.hihat.decay) + drumMachine.setDrumParams('hihatOpen', state.hihatOpen.pitch, state.hihatOpen.decay) + drumMachine.setDrumParams('clap', state.clap.pitch, state.clap.decay) + drumMachine.setDrumParams('cowbell', state.cowbell.pitch, state.cowbell.decay) + } + + // Telegram Haptic Feedback + if (window.Telegram?.WebApp?.HapticFeedback) { + window.Telegram.WebApp.HapticFeedback.impactOccurred('medium') + } + } + return (
@@ -45,6 +65,14 @@ export function DrumsView() { onChange={handleDriveChange} size={40} /> +
{(['808', '909'] as const).map(k => (