bl3kunja/Sdk_TV_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
main
Sdk_TV_app/README.md
T

264 lines
9.1 KiB
Markdown
Raw Permalink Blame History

# TV_APP V1.0.0 - Tournament Management System
A Flask-based web application for managing tournaments with multi-camera streaming support and improved modern UI architecture.
## Quick Start
### Prerequisites
- Python 3.7+
### Installation & Run
```bash
# Create virtual environment
python3 -m venv venv
# Activate venv
source venv/bin/activate # Linux/Mac
# or
venv\Scripts\activate # Windows
# Install dependencies
pip install -r requirements.txt
# Run the app
python3 tv_app.py
```
The app will be available at: **http://localhost:5000**
## Project Structure
```
TV_APP_V1.0.0/
├── tv_app.py # Main Flask application
├── requirements.txt # Python dependencies
├── README.md # This file
│
├── app/ # Support modules
│ ├── __init__.py
│ ├── config.py # Configuration
│ ├── models.py # Data models
│ ├── storage.py # Persistent storage
│ └── utils.py # Utilities
│
├── templates/ # HTML templates (15 files)
│ ├── index.html # Main dashboard
│ ├── tournament.html # Tournament configuration
│ ├── draft.html # Draft management
│ ├── results_calculator.html # Results calculation
│ ├── mobile.html # Mobile interface
│ ├── archive.html # Tournament history
│ ├── match_details.html # Match view
│ ├── player_stats.html # Player analytics
│ └── ... (10 more templates)
│
├── static/ # Static assets
│ ├── css/ # Modular CSS (NEW - Consolidated)
│ │ ├── base.css # Global styles & variables
│ │ ├── navbar.css # Navigation styling
│ │ ├── buttons.css # Button system
│ │ ├── components.css # Cards, forms, modals, tables
│ │ └── responsive.css # Media queries & responsive utilities
│ ├── js/ # JavaScript files
│ │ ├── websocket-client.js # (Deprecated - SocketIO removed)
│ │ └── ... (other JS files)
│ └── images/ # Images and assets
│
├── data/ # Runtime data (JSON state)
│ ├── tournaments.json # Tournament data
│ ├── leagues.json # League data
│ └── ... (other data files)
│
├── locales/ # Multi-language support
│ ├── en.json # English translations
│ └── sl.json # Slovenian translations
│
├── docs/ # Documentation (NEW)
│ ├── COMPLETE_DOCUMENTATION.md # Master documentation (60 KB, 2,065 lines)
│ ├── CSS_CONSOLIDATION_GUIDE.md # CSS implementation guide
│ ├── APP_RESTRUCTURE_BLUEPRINT.md # V2.0 architecture proposal
│ └── IMPLEMENTATION_QUICK_START.md # 4-week implementation roadmap
│
└── README.md # This file
```
## Features
✅ Tournament management with live scoring
✅ Multi-camera streaming integration
✅ Mobile interface for remote access
✅ Tournament archiving & history
✅ League management
✅ Multi-language support (English & Slovenian)
✅ JSON-based persistent storage
✅ **[NEW]** Modular CSS architecture with CSS variables
✅ **[NEW]** Fully responsive design (mobile-first)
✅ **[NEW]** Improved navigation structure
✅ **[NEW]** Comprehensive documentation suite
## Key URLs
- **Main Dashboard**: http://localhost:5000/
- **Tournament Config**: http://localhost:5000/tournament
- **Draft Management**: http://localhost:5000/draft
- **Results Calculator**: http://localhost:5000/results
- **Mobile Interface**: http://localhost:5000/mobile
- **Archive**: http://localhost:5000/archive
## CSS Architecture (NEW)
The application uses a modular, maintainable CSS structure based on modern CSS best practices:
### Core CSS Files (in `/static/css/`)
| File | Purpose | Lines | Size |
|------|---------|-------|------|
| **base.css** | Global reset, CSS variables, typography, utilities | 261 | 5.8 KB |
| **navbar.css** | Navigation bar styling and responsive behavior | 299 | 6.0 KB |
| **buttons.css** | Button system with variants and states | 365 | 7.4 KB |
| **components.css** | Cards, forms, modals, tables, alerts | 458 | 8.9 KB |
| **responsive.css** | Media queries and responsive utilities | 523 | 10 KB |
**Total**: 1,906 lines across 5 organized files (77% reduction from previous scattered styles)
### CSS Variables (base.css)
```css
:root {
/* Colors */
--primary: #007bff; /* Main brand color */
--secondary: #6c757d; /* Secondary color */
--success: #28a745; /* Success state */
--danger: #dc3545; /* Error state */
--warning: #ffc107; /* Warning state */
--info: #17a2b8; /* Info state */
/* Spacing */
--spacing-xs: 0.25rem;
--spacing-sm: 0.5rem;
--spacing-md: 1rem;
--spacing-lg: 1.5rem;
--spacing-xl: 2rem;
/* Transitions */
--transition-fast: 0.15s ease;
--transition-normal: 0.2s ease;
--transition-slow: 0.3s ease;
/* Border Radius */
--radius-sm: 4px;
--radius-md: 8px;
--radius-lg: 12px;
/* Shadows */
--shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.1);
--shadow-md: 0 4px 12px rgba(0, 0, 0, 0.1);
--shadow-lg: 0 6px 20px rgba(0, 0, 0, 0.15);
}
```
### Responsive Breakpoints
```css
Mobile (max-width: 480px)
Small (480px - 768px)
Tablet/Medium (768px - 992px)
Desktop/Large (992px+)
Ultra-wide (1920px+)
Landscape (max-height: 500px)
```
See [CSS_CONSOLIDATION_GUIDE.md](./docs/CSS_CONSOLIDATION_GUIDE.md) for complete component reference and customization guide.
## Dependencies
### Core
- **Flask 3.0.0** - Web framework
- **python-dotenv 1.0.0** - Environment variables
### Removed (Optimized)
- ~~Flask-SocketIO~~ - Removed for simplified, faster architecture
- ~~python-socketio~~ - Real-time sync was unreliable
- ~~python-engineio~~ - No longer needed
## Navigation Structure (IMPROVED)
The app now uses a simplified, focused navigation structure:
### Main Navigation
- **Dashboard** - Overview and tournament selection
- **Tournament** - Tournament configuration and settings
- **Draft** - Player draft management
- **Calculator** - Results and scoring
- **Mobile** - Remote access interface
### Removed from Top Navigation
- ~~Personal Analysis~~ - Moved to tournament context
- ~~Archive~~ - Available via Dashboard
This streamlined navigation allows users to focus on the core tournament workflow without distractions.
## Development Notes
The app structure is simple and maintainable:
- All Flask routes in `tv_app.py`
- Support modules in `app/` package
- Ready to split into blueprints if needed
- Each instance operates independently
- All data is saved to JSON files in `data/` folder
### Recent Improvements
1. **SocketIO Removal** - Removed WebSocket/SocketIO dependencies for a lighter, more reliable application
2. **CSS Consolidation** - Refactored 8,500+ lines of scattered CSS into 1,906 organized lines across 5 modular files
3. **Navigation Simplification** - Removed redundant navigation items, keeping only essential workflow steps
4. **Documentation** - Created comprehensive documentation suite for development and restructuring
### Documentation Suite
The `docs/` folder contains detailed guides:
- **[COMPLETE_DOCUMENTATION.md](./docs/COMPLETE_DOCUMENTATION.md)** - Master documentation (60 KB, 2,065 lines)
- Current app architecture and analysis
- V2.0 restructure blueprint
- 4-week implementation plan
- API endpoints reference
- Data schema documentation
- Testing strategy
- Migration guide
- **[CSS_CONSOLIDATION_GUIDE.md](./docs/CSS_CONSOLIDATION_GUIDE.md)** - CSS implementation details
- Component class reference
- CSS variables documentation
- Responsive design guide
- Customization instructions
- **[APP_RESTRUCTURE_BLUEPRINT.md](./docs/APP_RESTRUCTURE_BLUEPRINT.md)** - Architecture proposal
- Current vs. proposed structure
- New directory organization
- Feature implementation guide
- Module responsibilities
- **[IMPLEMENTATION_QUICK_START.md](./docs/IMPLEMENTATION_QUICK_START.md)** - Implementation roadmap
- Week-by-week breakdown
- Daily tasks and milestones
- Code examples for each phase
- Testing checklist
## Performance & Reliability
- **Lighter Codebase** - Removed unnecessary WebSocket dependencies
- **Better Maintainability** - Organized CSS into logical modules
- **Responsive Design** - Works seamlessly across all device sizes
- **Production-Ready** - Fully functional with JSON-based persistence
## How to Stop
Press `Ctrl+C` in the terminal where the app is running.
---
**Last Updated**: November 2025
**Version**: 1.0.0 with CSS & Navigation Improvements
Reference in New Issue View Git Blame Copy Permalink