Updated and optimized #8
Open
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
- upgrade Socket.IO 2.3.0 → 4.7.5 with CORS support - upgrade Express to 4.19.2 - upgrade Docker base image from node:boron → node:20-alpine - replace deprecated getUserMedia with navigator.mediaDevices.getUserMedia - remove jQuery dependency, use vanilla JavaScript - add TODO note for ScriptProcessorNode → AudioWorklet migration - fix client count API for Socket.IO 4.x compatibility - improve error handling for microphone access
…11CUmbFbwR589Q66u7HgkR8 Update critical security changes and dependencies
Audio Quality Improvements: - Create centralized configuration system in config.js - Increase default sample rate from 12kHz to 16kHz for better quality - Make all audio settings configurable (sample rate, bit depth, compression) - Add UI panel to display current audio quality settings - Users can now easily adjust quality vs bandwidth tradeoff Configuration Features: - Configurable sample rates: 8000, 12000, 16000, 24000, 32000, 48000 Hz - Configurable bit depth: 8, 16, 32-bit - Adjustable audio processing parameters (lowpass filter, compression) - Customizable minimum gain threshold for bandwidth optimization Opus Codec Foundation: - Install @geut/opus library for future Opus support - Include Opus encoder/decoder WASM files - Prepare infrastructure for Opus codec integration UI Enhancements: - Add settings display panel showing current configuration - Provide user guidance on how to modify settings - Improve layout with better spacing and styling Documentation: - Update README with audio quality configuration guide - Add quality presets (low bandwidth, high quality) - Mark sound quality improvement as completed in roadmap This addresses the roadmap item to "improve sound quality by implementing opus" by creating a flexible configuration system and laying the foundation for future Opus codec integration.
…CUmbFbwR589Q66u7HgkR8 feat: add configurable audio quality settings and Opus codec foundation
Server-Side Changes (server.js): - Implement room management system with create/join/leave functionality - Track active rooms and users in each room - Auto-create rooms when first user joins - Auto-delete empty rooms when last user leaves - Isolate audio transmission to users in the same room only - Add real-time room list updates - Emit room events: room-joined, room-left, user-joined, user-left Client-Side Changes: UI (index.html): - Add room selection panel with room name input - Add Join/Leave room buttons with state management - Display current room info (name and user count) - Show list of all active rooms with user counts - Add status messages for user feedback - Require users to join a room before starting audio Room Management (voip.js): - Add joinRoom() and leaveRoom() functions - Handle room socket events from server - Connect room events to UI callbacks - Maintain room state on client side UI Logic (main.js): - Implement room UI event handlers - Handle join/leave button clicks - Display room information dynamically - Update active rooms list in real-time - Prevent audio start without joining a room first - Enable Enter key to join rooms Documentation (README.md): - Add comprehensive room/channel documentation - Include usage instructions and examples - Document room features (auto-create, auto-delete, isolation) - Add use cases (team meetings, gaming, study groups, etc.) - Update roadmap to mark room support as completed Features: ✅ Multi-room support with unlimited simultaneous rooms ✅ Private conversations isolated by room ✅ Real-time room and user count updates ✅ Automatic room lifecycle management ✅ User-friendly room selection interface ✅ Room list showing all active rooms This implements feature B from the quality features roadmap.
…FbwR589Q66u7HgkR8 feat: add room/channel support for multi-room conversations
Server-Side Improvements (server.js): - Add SSL certificate error handling with try-catch - Provide helpful error messages for missing certificates - Include instructions for generating self-signed certificates - Add port conflict detection (EADDRINUSE) - Implement graceful shutdown handling (SIGTERM, SIGINT) - Add socket connection error handlers - Handle uncaught exceptions and unhandled rejections - Improve server startup logging with detailed status messages - Configure Socket.IO with extended ping timeout (60s) and interval (25s) Client-Side Improvements: Network Configuration (config.js): - Enhanced reconnection settings with exponential backoff - Infinite reconnection attempts - Configurable delays: 1s initial, 5s maximum - 20s connection timeout - Enable connection status display Socket.IO Integration (voip.js): - Initialize Socket.IO with reconnection configuration - Add comprehensive connection event handlers: - connect: Connection established - disconnect: Connection lost (with reason) - connect_error: Connection errors - reconnect_attempt: Show reconnection progress - reconnect: Successful reconnection - reconnect_error: Reconnection errors - reconnect_failed: All reconnection attempts failed - server-shutdown: Graceful server shutdown notification - Trigger status callbacks for all connection state changes Microphone Error Handling (voip.js): - Detailed error messages for specific error types: - NotAllowedError: Permission denied guidance - NotFoundError: No microphone detected - NotReadableError: Device busy - OverconstrainedError: Requirements not met - TypeError: Configuration error - Browser compatibility check with helpful message - Error callbacks for UI feedback UI Enhancements (index.html & main.js): - Add connection status indicator in header: - Green: Connected - Yellow: Disconnected - Orange: Reconnecting (with attempt count) - Red: Error/Failed - Gray: Server shutdown - Real-time status updates based on connection state - Auto-clear success messages after 5 seconds - Display critical error messages prominently - Re-enable "Start Talking" button on microphone errors - Visual feedback for all error scenarios Documentation (README.md): - Add comprehensive error handling section - Document server-side error handling features - Explain automatic reconnection behavior - List connection status indicators with meanings - Document microphone error messages - Include configuration examples - Mark error handling as completed in roadmap Features: ✅ SSL certificate validation with helpful errors ✅ Port conflict detection ✅ Graceful shutdown (Ctrl+C) ✅ Automatic infinite reconnection with exponential backoff ✅ Real-time visual connection status indicator ✅ Specific microphone error messages with guidance ✅ Exception and rejection handling ✅ Configurable reconnection parameters ✅ Server shutdown notifications This implements feature C: Better error handling with reconnection logic and user feedback improvements.
…mbFbwR589Q66u7HgkR8 feat: implement comprehensive error handling and automatic reconnection
…iables Configuration System: - Add dotenv package for .env file support - All server settings now configurable via environment variables - Create .env.example with all available options - Support multiple configuration methods (file, env vars, Docker) Server Configuration (server.js): - Load environment variables from .env file using dotenv - Make all settings configurable with sensible defaults: - SSL_PORT (default: 443) - HTTP_PORT (default: 80) - PRIVATE_KEY_PATH (default: ./cert/key.pem) - CERTIFICATE_PATH (default: ./cert/cert.pem) - CORS_ORIGIN (default: *) - PING_TIMEOUT (default: 60000ms) - PING_INTERVAL (default: 25000ms) - NODE_ENV (default: production) - DEBUG (default: false) - Add debug logging to display configuration on startup - Update Socket.IO initialization to use configurable values Environment Variables (.env.example): - Comprehensive example file with all options - Detailed comments explaining each variable - Default values documented - Security recommendations included Docker Improvements: Docker Compose (docker-compose.yml): - Full docker-compose.yml for easy deployment - Environment variable passthrough - Volume mounting for SSL certificates - Network configuration - Restart policy (unless-stopped) - Port mapping with variable support Dockerfile Enhancements: - Use npm ci for faster, deterministic installs - Production-only dependencies - Non-root user (nodejs) for security - Comprehensive environment variable defaults - Health check implementation - Better layer caching - Security labels and metadata - Clean up npm cache to reduce image size Development Tools (.gitignore): - Exclude .env files from version control - Add IDE files (.vscode, .idea) - Add log files (*.log, npm-debug.log*) - Maintain package-lock.json exclusion Documentation (README.md): - Comprehensive installation section with 3 methods - Docker Compose quick start (recommended) - Environment variables reference table - 4 configuration methods documented: 1. .env file for local development 2. Docker Compose for production 3. Docker CLI with -e flags 4. System environment variables - Docker Compose configuration examples - Security best practices section - Updated roadmap marking config management complete Features: ✅ Environment variable support with dotenv ✅ .env.example template file ✅ Docker Compose for one-command deployment ✅ Enhanced Dockerfile with security best practices ✅ Non-root Docker container ✅ Health checks ✅ Flexible configuration (4 methods) ✅ Debug logging mode ✅ Production-ready defaults ✅ Comprehensive documentation Security Improvements: - Non-root user in Docker (UID 1001) - .env files excluded from git - CORS configurable per environment - Production vs development modes - SSL certificate path configurability This implements feature D: Configuration management with environment variables, config files, and better Docker configuration.
…1CUmbFbwR589Q66u7HgkR8 feat: add comprehensive configuration management with environment variables
… reduction, VAD) This commit adds comprehensive audio processing features to improve voice quality: Audio Enhancement Features: - Echo Cancellation: Uses browser's built-in AEC to reduce feedback - Noise Suppression: Dual-layer approach with browser-level and custom noise gate - Voice Activity Detection (VAD): Energy and frequency-based speech detection - Automatic Gain Control: Browser-level AGC for consistent audio levels Implementation Details: - Added enhancements configuration section to config.js - Updated voip.js to enable browser audio enhancements via getUserMedia constraints - Implemented VAD function with RMS energy and zero-crossing rate analysis - Implemented noise suppression with configurable noise gate and smoothing - Updated audio processing pipeline in voipWorker.js Configuration: - All features configurable via VoipConfig.enhancements - Customizable thresholds for VAD (energy, frequency, silent frames) - Adjustable noise gate threshold and smoothing factor - Toggle options for each enhancement Documentation: - Added comprehensive Audio Enhancements section to README - Included configuration examples and tuning tips - Updated roadmap to mark VAD and echo cancellation as completed
…11CUmbFbwR589Q66u7HgkR8 feat: implement advanced audio enhancements (echo cancellation, noise reduction, VAD)
This commit adds comprehensive user interface enhancements for better audio control and feedback: Mute/Unmute Controls: - Added mute button that appears when user starts talking - Visual feedback with color changes (yellow → red) to indicate mute state - Mute state prevents audio transmission to other users - Local audio processing continues even when muted - Toggle functionality with clear icons (🔇 Mute / 🔊 Unmute) Visual Audio Level Indicators: - Real-time microphone level meter with gradient bar (blue) - Real-time incoming audio level meter with gradient bar (green) - Percentage display (0-100%) for exact audio levels - Pulse animation when audio is active (level > 5%) - Gray state for muted microphone - RMS-based audio level calculation for accurate metering UI/UX Improvements: - Audio levels panel appears when user starts talking - Smooth CSS transitions and animations - Responsive design with flexbox layout - Clear visual hierarchy with proper spacing - Professional styling with gradients and shadows Implementation Details: - Added CSS for audio meters in main.css - Updated index.html with mute button and audio level UI - Added mute/unmute functionality in voip.js - Integrated audio level calculation in main.js using RMS algorithm - Mute state properly blocks audio transmission in worker message handler Documentation: - Added comprehensive "User Controls" section to README - Documented mute/unmute usage and use cases - Documented audio level indicators with detailed explanations - Updated roadmap to mark features as completed
…UmbFbwR589Q66u7HgkR8 feat: add user mute/unmute controls and visual audio level indicators
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
No description provided.