From d46d0a5b54852bbc01ff75aba470355f6ab6dd04 Mon Sep 17 00:00:00 2001
From: 10x Developer <tenxdev@git.noratrieb.dev>
Date: Mon, 4 May 2026 21:38:08 +0200
Subject: [PATCH] Update README with AGENTS.md reference and project
 instructions

---
 README.md | 123 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 123 insertions(+)
 create mode 100644 README.md

diff --git a/README.md b/README.md
new file mode 100644
index 0000000..daac275
--- /dev/null
+++ b/README.md
@@ -0,0 +1,123 @@
+# Tschausepp - Jass Card Tracker
+
+Mobile-first React web app for tracking Schaffhauser (Jass) card game rounds using camera and feature matching to detect and assign cards to players.
+
+## Implementation Status
+
+### ✅ Completed Features
+- Basic React/TypeScript component structure
+- Mobile-friendly UI with responsive design
+- Camera access and preview functionality
+- Player setup with name management
+- Round results display with score calculation
+- Game history storage with localStorage
+- Export functionality for game history
+
+### 🔧 In Progress Features
+- **Detection Component**: TF.js integration for card boundary detection and suit identification
+- **Assignment Logic**: Radial sector layout with auto-assignment to players
+- **TensorFlow.js Integration**: Proper lite mode usage for feature matching
+- **Card Suited Detection**: Recognition of Schellen, Schilten, Eicheln, Rosen
+
+### 🚀 Features in Plan
+
+#### 1. Setup Screen
+- Enter 2-10 player names
+- Radial sector configuration
+- Custom card value mapping (placeholders ready)
+
+#### 2. Camera Screen
+- Live camera preview with card detection overlay
+- Auto-detect card boundaries (color + edge detection)
+- Suit identification (Schellen, Schilten, Eicheln, Rosen)
+- Auto-assign based on radial sector + nearest player
+
+#### 3. Results Screen
+- Group cards by player
+- Calculate round scores
+- Show totals & highlight high scorers
+- Options: Save Game | Play Next Round
+
+#### 4. History Screen
+- Browse last 100 games
+- JSON export for backup
+- Game date, player count, high score
+
+## Development Plan
+
+### Phase 1: Core Infrastructure
+- [x] React components structure
+- [x] State management with hooks and localStorage
+- [x] Routing between screens
+
+### Phase 2: Camera & Detection
+- [x] Camera feed integration
+- [x] Card detection framework (Detection component)
+- [ ] TensorFlow.js integration for feature matching
+- [ ] Card boundary detection with edge detection
+- [ ] Suit identification (Schellen/Schilten/Eicheln/Rosen)
+
+### Phase 3: Assignment & Radial Layout
+- [x] Basic radial sector concept
+- [ ] Complete radial sector implementation
+- [ ] Automatic card assignment to closest player
+- [ ] Radial visualization for player positioning
+
+### Phase 4: Polishing & Enhancement
+- [ ] Improved UI/UX with better visual feedback
+- [ ] Performance optimizations
+- [ ] Additional game features (multi-round tracking, etc.)
+
+## Tech Stack
+
+- React 18 (lightweight runtime)
+- TensorFlow.js (lite mode, CDN-hosted, ~5MB)
+- HTML5 Camera API (Mobile-friendly)
+- localStorage (JSON format, max 100 games)
+
+## Usage Instructions
+
+1. Enter player names in the setup screen (2-10 players)
+2. Configure card point values for each suit
+3. Start the game to begin taking photos
+4. When round ends, click "SCAN TABLE" 
+5. Camera will auto-detect and assign cards to players
+6. View results and save game history
+
+## Architecture
+
+The application follows a component-based architecture with:
+- Setup screen for initial game configuration
+- Camera screen for card detection
+- Results screen for score calculation
+- History screen for storage management
+
+Data is persisted in localStorage with a maximum of 100 games.
+
+## Development Notes
+
+### TensorFlow.js Integration
+The application is configured to use TensorFlow.js with the `@tensorflow/tfjs` package. While full integration is still in development, the framework is in place to properly implement:
+- Lightweight model loading for mobile devices
+- Feature matching for card detection
+- Suit recognition algorithms
+
+### Mobile-first Design
+All UI components are built with mobile responsiveness in mind:
+- Touch-friendly buttons and controls
+- Adaptive layouts for different screen sizes
+- Camera access optimized for mobile devices
+
+### Performance Considerations
+- Card detection uses sampling for performance
+- TensorFlow.js models are optimized for browser execution
+- Only last 100 games are stored in local storage
+
+## Project Instructions
+
+This project includes an AGENTS.md file with detailed instructions for working with the codebase. Please refer to that file for:
+- Key developer commands
+- Architecture notes
+- Framework quirks
+- Testing conventions
+- Setup requirements and environment quirks
\ No newline at end of file