Critical fix for audio management: - Added missing audio IPC functions to preload.js - selectAudio: File dialog for selecting audio files - readAudioDirectory: Directory scanning with title formatting - copyAudio: File copying for audio import Issue: - Audio IPC handlers existed in main.js but weren't exposed to renderer - selectAndImportAudio() calls were failing with 'undefined function' errors - Upload functionality was broken due to missing API bridge Fix: - Exposed all three audio IPC functions in electronAPI context bridge - Audio import buttons now have access to required backend functionality - Maintains consistency with existing image API pattern Now audio management fully functional: File selection dialogs work Directory scanning operational File copying and import functional Ready for user testing |
||
|---|---|---|
| audio | ||
| images | ||
| .gitignore | ||
| README-DESKTOP.md | ||
| README.md | ||
| desktop-file-manager.js | ||
| game.js | ||
| gameData.js | ||
| index.html | ||
| main.js | ||
| package-lock.json | ||
| package.json | ||
| preload.js | ||
| setup.bat | ||
| setup.sh | ||
| styles.css | ||
README.md
Task Challenge Game
A web-based task management game with customizable images, themes, and comprehensive image management system.
Features
🎮 Game Features
- Task Management System: Complete tasks to earn points
- Consequence System: Skip tasks face consequences
- Multiple Difficulty Levels: Easy, Medium, Hard tasks with different point values
- Game Statistics: Track completion rates, points, and performance
- Pause/Resume Functionality: Full game state management
- Keyboard Shortcuts: Quick controls for power users
🎨 Customization
- Theme System: Multiple visual themes (midnight, ocean, forest, etc.)
- Background Music: 4 music tracks with loop/shuffle controls
- Volume Control: Adjustable audio settings
- Image Management: Upload and manage custom task/consequence images
🖼️ Advanced Image System
- Categorized Images: Separate task and consequence image pools
- High-Quality Processing: 1600x1200 resolution with 95% JPEG quality
- Smart Compression: Automatic resizing for optimal storage
- Batch Operations: Upload multiple images, select/delete in bulk
- Storage Management: 50 image limit with quota monitoring
- Format Support: JPG, PNG, WebP image formats up to 20MB
🛠️ Technical Features
- Local Storage: All data stored locally in browser
- Responsive Design: Works on desktop and mobile
- Cross-Browser Compatible: Modern browser support
- No Backend Required: Pure client-side application
Getting Started
Quick Start
- Open
index.htmlin a modern web browser - Choose your theme and start playing
- Upload custom images through the Image Management screen
Local Development
# Clone the repository
git clone [repository-url]
cd webGame
# Serve locally (recommended)
python -m http.server 8000
# OR
npx serve .
# Open browser to http://localhost:8000
File Structure
webGame/
├── index.html # Main game interface
├── game.js # Core game logic and image management
├── styles.css # All styling and themes
├── images/
│ ├── tasks/ # Default task images
│ ├── consequences/ # Default consequence images
│ └── cached/ # User-uploaded processed images
├── audio/ # Background music files
└── README.md # This file
Image Management
Upload Process
- Navigate to Image Management screen
- Switch between "Task Images" and "Consequence Images" tabs
- Click "Upload Images" to select files
- Images are automatically processed and optimized
Storage System
- Quality: High-quality compression (1600x1200, 95% JPEG quality)
- Limits: 50 total images to prevent storage issues
- Categories: Separate pools for tasks vs consequences
- Formats: Supports JPG, PNG, WebP up to 20MB each
Management Features
- Enable/Disable: Control which images appear in game
- Bulk Operations: Select all, delete multiple images
- Storage Info: Monitor usage and get cleanup suggestions
Game Controls
Mouse Controls
- Click buttons for all game actions
- Select/deselect images in management screens
Keyboard Shortcuts
- Enter: Complete current task
- Ctrl: Skip current task
- Shift+Ctrl: Mercy skip (if available)
- Space/P: Pause/resume game
- M: Toggle background music
- H: Show help
- Escape: Close dialogs/go back
Development History
Recent Updates (v1.4)
- ✅ Implemented categorized image system (Task/Consequence separation)
- ✅ Enhanced image processing with higher quality compression
- ✅ Added storage quota management and limits
- ✅ Fixed tab switching and individual image selection
- ✅ Improved error handling and user feedback
- ✅ Added batch upload and management features
Technical Architecture
- DataManager Class: Centralized localStorage management
- TaskChallengeGame Class: Main game logic and state management
- Image Processing: Canvas-based compression and optimization
- Event System: Comprehensive keyboard and mouse event handling
- Theme System: CSS-based visual customization
Browser Compatibility
- ✅ Chrome/Chromium (recommended)
- ✅ Firefox
- ✅ Safari
- ✅ Edge
- ⚠️ IE11+ (limited support)
Contributing
Development Setup
- Clone repository
- Use local server for testing (file:// protocol has limitations)
- Test across different browsers
- Follow existing code structure and commenting style
Code Organization
game.js: Main game logic, image management, data persistencestyles.css: All styling including themes and responsive designindex.html: Clean semantic HTML structure
Version History
- v1.0: Initial implementation with basic game mechanics
- v1.1: Added theme system and music controls
- v1.2: Implemented image upload and management
- v1.3: Enhanced image processing and categorization
- v1.4: Added storage management and quota limits (current)
License
[Add your preferred license here]