Sebastian Krüger
0d43d73014
Fixed two issues: 1. Made audio editor full width by removing max-w-6xl wrapper 2. Fixed insertBufferSegment bug where paste operation had incorrect target buffer indexing causing corrupted audio after paste Changes: - app/page.tsx: Removed max-w-6xl constraint for full-width editor - lib/audio/buffer-utils.ts: Fixed paste buffer copying logic * Corrected target index calculation in "copy after insert point" loop * Was: targetData[insertBuffer.length + i] = sourceData[i] * Now: targetData[insertSample + insertBuffer.length + (i - insertSample)] = sourceData[i] 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
76 lines
2.7 KiB
TypeScript
76 lines
2.7 KiB
TypeScript
'use client';
|
|
|
|
import * as React from 'react';
|
|
import { Music, Settings } from 'lucide-react';
|
|
import { ThemeToggle } from '@/components/layout/ThemeToggle';
|
|
import { Button } from '@/components/ui/Button';
|
|
import { ToastProvider } from '@/components/ui/Toast';
|
|
import { AudioEditor } from '@/components/editor/AudioEditor';
|
|
|
|
export default function Home() {
|
|
return (
|
|
<ToastProvider>
|
|
<div className="min-h-screen bg-background">
|
|
{/* Header */}
|
|
<header className="border-b border-border sticky top-0 bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60 z-50">
|
|
<div className="container mx-auto px-3 sm:px-4 py-3 sm:py-4 flex items-center justify-between gap-2">
|
|
<div className="min-w-0 flex-1 flex items-center gap-3">
|
|
<Music className="h-6 w-6 text-primary flex-shrink-0" />
|
|
<div className="min-w-0">
|
|
<h1 className="text-xl sm:text-2xl font-bold text-foreground">Audio UI</h1>
|
|
<p className="text-xs sm:text-sm text-muted-foreground truncate">
|
|
Professional audio editing in your browser
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div className="flex items-center gap-2">
|
|
<Button
|
|
variant="ghost"
|
|
size="icon"
|
|
title="Settings"
|
|
>
|
|
<Settings className="h-5 w-5" />
|
|
</Button>
|
|
<ThemeToggle />
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
{/* Main content */}
|
|
<main className="container mx-auto px-3 sm:px-4 py-6 sm:py-8">
|
|
<AudioEditor />
|
|
</main>
|
|
|
|
{/* Footer */}
|
|
<footer className="border-t border-border mt-8 sm:mt-12">
|
|
<div className="container mx-auto px-3 sm:px-4 py-6 text-center text-xs sm:text-sm text-muted-foreground">
|
|
<p>
|
|
Powered by{' '}
|
|
<a
|
|
href="https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="text-primary hover:underline"
|
|
>
|
|
Web Audio API
|
|
</a>
|
|
{' '}and{' '}
|
|
<a
|
|
href="https://nextjs.org"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="text-primary hover:underline"
|
|
>
|
|
Next.js 16
|
|
</a>
|
|
</p>
|
|
<p className="mt-2">
|
|
All audio processing happens locally in your browser. No files are uploaded.
|
|
</p>
|
|
</div>
|
|
</footer>
|
|
</div>
|
|
</ToastProvider>
|
|
);
|
|
}
|