46 lines
No EOL
1.8 KiB
Markdown
46 lines
No EOL
1.8 KiB
Markdown
# Tschausepp - Jass Card Tracker
|
|
|
|
## Project Overview
|
|
Mobile-first React web app for tracking Schaffhauser (Jass) card game rounds using camera and feature matching to detect and assign cards to players.
|
|
|
|
## Tech Stack
|
|
- React 18 (lightweight runtime)
|
|
- TensorFlow.js (lite mode, CDN-hosted, ~5MB)
|
|
- HTML5 Camera API (Mobile-friendly)
|
|
- localStorage (JSON format, max 100 games)
|
|
|
|
## Key Implementation Details
|
|
|
|
### Architecture
|
|
- Component-based structure with 5 main screens:
|
|
1. Setup Screen - Player management and game configuration
|
|
2. Camera Screen - Live preview with card detection overlay
|
|
3. Detection Component - Card boundary detection using image processing
|
|
4. Assignment Component - Radial sector layout with auto-assignment
|
|
5. Results Screen - Score calculation and game results
|
|
6. History Screen - Game storage and export functionality
|
|
|
|
### Development Commands
|
|
- `npm run build` - Build production version
|
|
- `npm run preview` - Preview production build
|
|
- `npm run typecheck` - Run TypeScript type checking
|
|
|
|
### Development Server
|
|
- A development server is always guaranteed to be running on localhost:5173
|
|
- **Do not start the development server manually under any circumstances**
|
|
|
|
### Camera & Detection
|
|
- Uses HTML5 Camera API with environment-facing camera preference
|
|
- Card detection implemented with custom image processing techniques
|
|
- Suit identification (Schellen, Schilten, Eicheln, Rosen) via color analysis
|
|
- Auto-assignment based on radial sector + nearest player calculation
|
|
|
|
### Data Storage
|
|
- Games stored in localStorage with maximum of 100 games
|
|
- Data structure follows: games → rounds → cards with player assignments
|
|
- JSON format for export functionality
|
|
|
|
### Mobile-First Design
|
|
- Responsive UI optimized for mobile devices
|
|
- Touch-friendly controls and interfaces
|
|
- Camera access optimized for mobile environment |