CRATER CODED-NEXUS Gaming Platform

A browser-based gaming platform featuring three AI-controlled games with automatic screen recording capabilities and a comprehensive gaming museum. Optimized for deployment on Vercel's free tier.

Features

🎮 AI-Controlled Games

• AI Maze Battle: Four colored squares battle through mazes with breakable blocks, hazards, and power-ups
• Escape the Circle: Balls attempt to escape a rotating circle within a 3-second time limit
• Cat Chase Maze: Predator-prey chase mechanics through randomly generated mazes

📹 Screen Recording

• Automatic gameplay recording during each round
• Canvas-only capture excluding UI elements
• Optimized recording quality for web playback
• Local storage with cleanup management

📱 Social Media Export

• Export recordings in 9:16 aspect ratio for vertical platforms
• Direct export options for Instagram Reels, YouTube Shorts, and TikTok
• Client-side video processing for optimal file sizes

🏛️ Gaming Museum

• Comprehensive archive of historical games with documentation
• Organized by era, genre, and platform
• External links to playable versions and emulation services
• Search functionality across all archived content

Technology Stack

• Frontend: TypeScript, Vite, HTML5 Canvas
• Styling: CSS3 with responsive design
• APIs: MediaRecorder API, Web Audio API
• Deployment: Vercel (optimized for free tier)
• Build Tools: ESLint, Prettier, TypeScript strict mode

Performance Optimization

• RAM usage under 512MB for Vercel free tier compatibility
• 30 FPS frame rate limiting for reduced CPU usage
• Object pooling for frequently created/destroyed entities
• Code splitting and lazy loading for optimal bundle sizes
• Hardware acceleration when available

Getting Started

Prerequisites

• Node.js 18.0.0 or higher
• npm or yarn package manager

Installation

1. Clone the repository:

git clone <repository-url>
cd crater-coded-nexus

2. Install dependencies:

npm install

3. Start the development server:

npm run dev

4. Open your browser and navigate to http://localhost:3000

Development Scripts

# Start development server
npm run dev

# Build for production
npm run build

# Preview production build
npm run preview

# Run linting
npm run lint

# Fix linting issues
npm run lint:fix

# Format code
npm run format

# Check formatting
npm run format:check

# Type checking
npm run type-check

Deployment

Vercel Deployment

1. Install Vercel CLI:

npm install -g vercel

2. Deploy to Vercel:

vercel

The project is pre-configured with vercel.json for optimal deployment settings.

Manual Deployment

1. Build the project:

npm run build

2. Deploy the dist folder to your hosting provider

Project Structure

src/
├── core/           # Core game management and orchestration
├── engines/        # Individual game engines
├── recording/      # Screen recording and media export
├── museum/         # Gaming museum components
├── ui/            # User interface components
├── types/         # TypeScript type definitions
├── utils/         # Utility functions
└── styles/        # CSS stylesheets

Browser Compatibility

• Chrome 80+
• Firefox 75+
• Safari 13+
• Edge 80+

Requires modern browser support for:

• HTML5 Canvas
• MediaRecorder API
• Web Audio API
• ES2020 features

Contributing

1. Fork the repository
2. Create a feature branch: git checkout -b feature-name
3. Make your changes and ensure tests pass
4. Commit your changes: git commit -m 'Add feature'
5. Push to the branch: git push origin feature-name
6. Submit a pull request

License

This project is licensed under the MIT License - see the LICENSE file for details.

Acknowledgments

• Built with modern web technologies for optimal performance
• Designed for accessibility and responsive user experience
• Optimized for free-tier hosting services