Ambient Sound Mixer - JavaScript OOP Project - 3.5+ Hours
Oct 14, 2025•Channel
AI Analysis
Data from YouTube Data API v3•Updated Just now
Video Overview
Video Details
Published8 months ago
Duration3:40:13
Video IDe-hGCPaRZYk
Languageen
CategoryScience & Technology
PrivacyPublic
Made for KidsNo
Video TypeRegular Video
Performance Metrics
Views10.8K
Likes813
Comments26
Engagement Rate7.74%
Likes per 100 views7.50
Comments per 1K views2.40
Video Tags
Description
This is a new project that I added to my Modern JS From The Beginning course. It is an ambient sound mixer that plays multiple sounds and allows you to create presets for later listening. It uses an object-oriented paradigm and focuses on concepts like encapsulation and single responsability.
Full Course (40 Hours) - TM & Udemy Versions
- https://www.traversymedia.com/modern-javascript-2-0
- https://www.udemy.com/course/modern-javascript-from-the-beginning
Final Code & HTML/CSS Template
https://github.com/bradtraversy/ambient-sound-mixer
The theme is in /resources/ambient-sound-mixer-theme
Timestamps:
00:00 - Intro
03:26 - File Structure
07:08 - Template & Setup
11:23 - Sound Data & Main Class Init
19:34 - Sound Manager & Load Sounds
29:50 - Play, Pause & Volume
40:53 - UI Class
53:59 - Event Listeners & Play Button
01:07:27 - Volume Sliders
01:20:48 - Master Volume Slider
01:33:22 - Master Play Button
01:50:11 - Reset Button
02:00:35 - Default Presets
02:18:36 - Save Custom Presets
02:41:24 - Show Custom Presets
02:49:15 - Load Custom Presets
02:59:28 - Delete Custom Preset
03:06:49 - Sleep Timer
03:28:55 - Theme Toggle
03:34:38 - Deploy To Vercel