From dc83350d58b819eead88d32f824eebdf1785e196 Mon Sep 17 00:00:00 2001 From: "google-labs-jules[bot]" <161369871+google-labs-jules[bot]@users.noreply.github.com> Date: Fri, 19 Jun 2026 02:40:59 +0000 Subject: [PATCH] Implement authentic DSP drum synthesis and engine synchronization Refined the drum synthesis engine based on 'Analog Drum Synthesis in Web Audio API' research. Key changes: - Implemented 15-bit LFSR noise generation in `DrumUtils.ts` for TR-909 authenticity. - Updated `TR909Snare` with LFSR snappy component and 30ms pitch sweep. - Improved resource management in `TR808HiHat` and `TR808Cowbell` using `activeVoices` tracking for clean node disposal. - Added safety guards for `exponentialRampToValueAtTime` across all drum models. - Implemented `syncInternalParams` in `DrumMachine` to ensure engine-UI parity on launch. - Optimized `instrumentStore` with techno-focused Euclidean defaults and a new `randomizeTechno` feature. - Enhanced `DrumsView` with a randomization button and Telegram haptic feedback integration. - Verified build stability and UI integration via Playwright. Co-authored-by: Pitrat-wav <255843145+Pitrat-wav@users.noreply.github.com> --- src/components/DrumsView.tsx | 17 ++++++++++++++++- src/logic/DrumMachine.ts | 12 ++++++++++++ src/logic/DrumUtils.ts | 26 ++++++++++++++++++++++++++ src/logic/drums/TR808Clap.ts | 8 +++++--- src/logic/drums/TR808Cowbell.ts | 21 +++++++++++++-------- src/logic/drums/TR808HiHat.ts | 21 +++++++++++++-------- src/logic/drums/TR808Kick.ts | 5 ++++- src/logic/drums/TR808Snare.ts | 7 ++++--- src/logic/drums/TR909Kick.ts | 9 ++++++--- src/logic/drums/TR909Snare.ts | 17 +++++------------ src/store/audioStore.ts | 12 ++++++++++++ src/store/instrumentStore.ts | 15 ++++++++++++--- 12 files changed, 128 insertions(+), 42 deletions(-) diff --git a/src/components/DrumsView.tsx b/src/components/DrumsView.tsx index 7d191e90..f8dbcc30 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 } = useDrumStore() const { drumMachine, volumes, setVolume } = useAudioStore() const updateDrum = (drum: 'kick' | 'snare' | 'hihat' | 'hihatOpen' | 'clap' | 'cowbell', params: Partial) => { @@ -30,6 +30,13 @@ export function DrumsView() { if (drumMachine) drumMachine.setSaturation(v) } + const handleRandomize = () => { + randomizeTechno() + if (window.Telegram?.WebApp?.HapticFeedback) { + window.Telegram.WebApp.HapticFeedback.impactOccurred('medium') + } + } + return (
@@ -45,6 +52,14 @@ export function DrumsView() { onChange={handleDriveChange} size={40} /> +
{(['808', '909'] as const).map(k => (