🎵 TuneMaker

A modern web-based audio clipping tool that allows users to upload music files and create custom audio clips with an intuitive waveform interface.

✨ Features

• 🎧 Audio File Upload - Support for various audio formats
• 📊 Interactive Waveform - Visual audio representation with click-to-select
• 🎯 Drag & Drop Markers - Color-coded start (green) and end (red) markers
• ⏱️ Precise Timing - Manual time input controls with validation
• 🎮 Live Preview - Preview your clip with animated progress bar
• 🔊 Volume Control - Built-in audio player with volume adjustment
• 📱 Responsive Design - Works on desktop and mobile devices
• 🌙 Dark Theme - Modern dark interface with neon accents
• 🎬 Video Background - Dynamic DJ party atmosphere
• ⚡ 5-Second Minimum - Automatic validation ensures clips are at least 5 seconds

🚀 Live Demo

Try Tunemaker - https://aqiulc.github.io/tunemaker/

🛠️ How to Use

1. Upload Audio - Click "Choose Audio File" and select your music
2. Select Clip - Drag the green (start) and red (end) markers on the waveform
3. Fine-tune - Use the time input fields for precise control
4. Preview - Click "Preview Clip" to hear your selection
5. Download - Click "Download Clip" to save as WAV file

🎨 Design Features

• Retro Logo - Animated rainbow gradient "TuneMaker" with bouncing music notes
• Glass Morphism - Translucent interface with backdrop blur effects
• Smooth Animations - Progress bars, waveform interactions, and loading states
• Professional UI - Dark theme optimized for music production workflows

🔧 Technical Stack

• Frontend: Vanilla HTML5, CSS3, JavaScript (ES6+)
• Audio Processing: Web Audio API
• Canvas Graphics: HTML5 Canvas for waveform visualization
• File Handling: File API for audio upload and processing
• Export Format: WAV audio files

📁 Project Structure

tunemaker/
├── index.html              # Main application page
├── script.js               # Core JavaScript functionality
├── style.css               # Styling and animations
├── dj-party-background.mp4  # Background video
└── README.md               # Project documentation

🌟 Browser Support

• ✅ Chrome 60+
• ✅ Firefox 55+
• ✅ Safari 14+
• ✅ Edge 79+

Requires Web Audio API support

🎵 Audio Format Support

• MP3
• WAV
• M4A
• OGG
• FLAC
• And more...

📝 License

This project is open source and available under the MIT License.

🤝 Contributing

Contributions are welcome! Feel free to:

• 🐛 Report bugs
• 💡 Suggest new features
• 🔧 Submit pull requests
• ⭐ Star this repository if you find it useful!

👨‍💻 Development

To run locally:

1. Clone this repository
2. Add your own dj-party-background.mp4 file
3. Open index.html in a modern web browser
4. Start creating audio clips!

---

Made with ❤️ for music creators and audio enthusiasts

TuneMaker - Where audio clips come to life 🎶