MTT Clock - Multi-Table Tournament Timer

A client-side React/TypeScript single-page application for managing poker multi-table tournament (MTT) clocks and tournament state tracking.

Features

• Tournament Timer Display: Large, easy-to-read display visible from 20+ feet away
• Timestamp-Based Timer: Accurate timer that never drifts, even across browser refreshes and pauses
• Entrants Tracking: Track total entries, players remaining, and computed average stack
• Registration Management: Toggle registration open/closed with locked entry modifications
• Prize Pool Management: Configure ITM places and payout structure
• Level Structure Editor: Customize blind structure with breaks and antes
• Tournament Controls: Start, pause, resume, and navigate between levels
• Local Persistence: All state saved in IndexedDB with localStorage fallback
• Import/Export: Backup and restore tournament state as JSON files
• Dark Mode UI: Optimized for viewing in various venue lighting conditions
• Responsive Design: Works on iPad, desktop, and 1080p TV/projector

Installation

npm install

Development

npm run dev

Open your browser to the URL shown (typically http://localhost:5173)

Building for Production

npm run build

The built files will be in the dist directory.

Usage

Display View

• Large format display optimized for projection
• Shows current level, blinds, ante, timer, next level, and tournament stats
• Toggle between Display and Admin views using the button in the top-right

Admin View

• Tournament Controls: Start/pause/resume tournament, navigate levels
• Entrants Editor: Modify total entrances and players remaining with history tracking
• Prize Pool Management: Configure ITM places and payout structure
• Level Structure Editor: Add, edit, delete, and reorder levels
• Import/Export: Backup or restore tournament state

Keyboard Shortcuts

Use the view toggle button to switch between Display (📺) and Admin (⚙️) modes.

Architecture

• No Backend: Everything runs in the browser
• Timestamp-Based Timer: Time calculated from timestamps, not incremented
• Immutable State: Predictable state updates with full history tracking
• IndexedDB Storage: Primary persistence with localStorage fallback
• Property-Based Design: All requirements validated through formal properties

Requirements Implemented

All 11 requirements from the specification are fully implemented:

1. ✅ Tournament Timer Display
2. ✅ Timestamp-Based Timer Calculation
3. ✅ Entrants and Average Stack Tracking
4. ✅ Registration State Management
5. ✅ Prize Pool Management
6. ✅ Level Structure Editor
7. ✅ Tournament Control Actions
8. ✅ Local Persistence
9. ✅ Demo Data Initialization
10. ✅ Responsive Dark Mode UI
11. ✅ State Serialization (Import/Export)

Technology Stack

• React 18: UI framework
• TypeScript: Type safety and better developer experience
• Vite: Fast build tool and dev server
• TailwindCSS: Utility-first CSS framework with dark mode
• IndexedDB: Primary persistence layer
• localStorage: Fallback persistence

Browser Compatibility

Works in all modern browsers that support:

• ES2020+
• IndexedDB or localStorage
• React 18

Tested on Chrome, Firefox, Safari, and Edge.

License

Proprietary