💬 ChatterPy - Enhanced Real-Time Chat Application

A modern, responsive real-time chat application built with Flask and Socket.IO featuring a beautiful UI, code snippet support, and enhanced user experience.

✨ Completely Redesigned & Enhanced!

---

🎨 What's New - Major UI/UX Overhaul

Modern Interface

• 🌈 Stunning gradient backgrounds with glass morphism effects
• 📱 Fully responsive design - works perfectly on all devices
• ✨ Smooth animations and micro-interactions
• 🎯 Professional dark theme with purple/pink accents
• 🔤 Beautiful typography using Inter font family

Enhanced Chat Features

• 💻 Code snippet support with syntax highlighting (Prism.js)
• 😊 Interactive emoji picker with 100+ emojis
• 💬 Improved private messaging with @username mentions
• 🔒 Private rooms with codes - create secure rooms and share 6-digit codes
• ⌨️ Live typing indicators - see who's typing in real-time
• � Message history navigation using arrow keys
• � ACharacter counter with visual feedback (2000 char limit)
• � *Auto-resizing text input that grows with your message
• 🔗 Smart URL detection - links become clickable automatically
• 🚫 Fixed duplicate messages when switching rooms

Better User Experience

• 🟢 Real-time connection status indicator
• 👥 Live user count and enhanced user list
• 🎨 Color-coded user avatars with initials
• 📱 Mobile-optimized interface with touch-friendly controls
• 🔔 Desktop notifications support
• ⚡ Instant message delivery with improved Socket.IO config

---

🛠️ Technical Improvements

Reliability & Performance

• 🛡️ Enhanced error handling with user-friendly messages
• 🧹 Message sanitization to prevent XSS attacks
• 📊 Improved logging system with structured output
• 🚀 Optimized Socket.IO configuration for better performance
• 🔒 Secure session management with proper cookie settings

Developer Experience

• 📁 Clean code architecture with proper separation of concerns
• 🔧 Environment variable support with .env files
• 🏥 Health check endpoints for monitoring
• 📝 Comprehensive error pages with helpful information
• 🧪 Ready for testing with improved structure

---

🚀 Quick Start

1. Install dependencies:

   pip install -r requirements.txt

2. Run the application:

   python run.py

3. Open your browser: Navigate to http://localhost:5000

---

🎯 How to Use

Basic Chatting

• Select a room from the sidebar
• Type your message and press Enter
• Use Shift+Enter for multi-line messages

Code Sharing

• Click the code button </> or type /code followed by your code
• Supports syntax highlighting for multiple programming languages
• Perfect for developer discussions!

Private Messages

• Type @username your message to send private messages
• Click on any user in the sidebar to start a private conversation

Private Rooms

• Click "Create Private Room" to make a secure room with a 6-digit code
• Share the code with friends to invite them to your private room
• Click "Join with Code" to enter someone else's private room
• Private rooms are automatically deleted when empty

Emojis & Shortcuts

• Click the emoji button 😊 to open the emoji picker
• Use text shortcuts: :) → 😊, <3 → ❤️, :thumbsup: → 👍

Keyboard Shortcuts

• Enter: Send message
• Shift+Enter: New line
• ↑/↓: Navigate through message history
• Ctrl+/: Toggle code mode

---

🏗️ Project Structure

app/
├── __init__.py          # Enhanced app factory with better config
├── config.py            # Comprehensive configuration settings
├── routes.py            # HTTP routes with API endpoints
├── socket_events.py     # Real-time event handlers with error handling
├── static/
│   ├── chat.js         # Modern chat client (completely rewritten)
│   ├── styles.css      # Beautiful CSS with animations
│   └── favicon.ico     # App icon
├── templates/
│   ├── index.html      # Modern chat interface
│   └── error.html      # User-friendly error pages
└── utils/              # Utility modules

---

🔧 Configuration Options

Key settings in app/config.py:

• CHAT_ROOMS: Available chat rooms (now includes Tech Talk, Gaming, etc.)
• MAX_MESSAGE_LENGTH: Message length limit (2000 characters)
• CORS_ORIGINS: CORS configuration for security
• DEBUG: Development/production mode toggle

---

🚀 Deployment Ready

Production Checklist

• ✅ Environment variables support
• ✅ Secure cookie configuration
• ✅ CORS properly configured
• ✅ Error handling and logging
• ✅ Health check endpoints
• ✅ Rate limiting ready (Redis support)

---

🤝 Contributing

This project is now much more maintainable and feature-rich! Feel free to:

1. Fork the repository
2. Add new features or improvements
3. Submit pull requests
4. Report issues or suggestions

---

📄 License

MIT – Free to use, modify, and share.

---

🎉 Enjoy ChatterPy - your enhanced chat experience with private rooms, code sharing, and beautiful design!