A TypeScript web application for viewing, filtering, and exporting Euroleague basketball statistics for fantasy basketball leagues. Built for deployment on Val Town.

Now using API v3 - Migrated from v1 to v3 for JSON responses and richer data!

• Easy Parameter Manipulation: Filter by season, phase, team, and data type
• Interactive Data Tables: Sortable columns with pagination
• Data Visualization: Compare player statistics with interactive charts
• CSV Export: Download filtered data as CSV files
• Responsive Design: Works on desktop and mobile devices
• Accessibility: ARIA labels, keyboard navigation, and screen reader support
• API v3 Integration: Uses modern JSON API with enhanced data models
• Rich Statistics: Access to traditional, advanced, scoring, and misc player stats
• Multiple Standings Views: Basic, calendar, streak, ahead/behind, and margins standings

/
├── main.tsx                    # Main HTTP val entry point (serves HTML + handles API)
├── types/
│   └── euroleague.ts          # TypeScript interfaces for API responses
├── api/
│   └── client.ts              # Euroleague API client wrapper
├── utils/
│   ├── csv.ts                 # CSV export utilities
│   └── formatters.ts          # Data formatting helpers
└── README.md                  # This file

1. Use the Val Town MCP tools to create a new val:

   Create a new HTTP val named "euroleague-stats"
   

2. Copy the contents of main.tsx into the val's main file

3. The app will be available at the val's endpoint URL

1. Go to val.town
2. Create a new HTTP val
3. Copy the contents of main.tsx into the editor
4. Save and deploy

1. Visit the deployed app URL
2. Select filters:
   • Data Type: Choose Players, Games, Results, Standings, or Schedules
   • Season: Select the season (e.g., 2024-25)
   • Phase: Filter by Regular Season, Playoffs, or Final Four
   • Team: Filter by specific team or view all teams
3. View data in the sortable table
4. For player data:
   • Click on player names to add them to the chart comparison
   • View top 10 players or selected players in the comparison chart
5. Click "Download CSV" to export the current filtered data

The app serves both the frontend and API endpoints:

• GET / - Serves the main HTML page with React app
• GET /api/players?seasonCode=E2024&teamCode=XXX - Get player traditional stats (v3)
• GET /api/games?seasonCode=E2024 - Get games
• GET /api/results?seasonCode=E2024 - Get game results
• GET /api/standings?seasonCode=E2024&roundNumber=1 - Get basic standings (v3)
• GET /api/schedules?seasonCode=E2024 - Get schedules
• GET /api/teams or GET /api/clubs - Get all clubs/teams (v3)

For local development (not Val Town):

1. Install dependencies (if using a bundler):

   npm install

2. Run a local server (e.g., using Deno):

   deno run --allow-net --allow-read main.tsx

3. Open http://localhost:8000 in your browser

This app uses the Euroleague API v3:

• Base URL: https://api-live.euroleague.net/v3
• JSON Responses: v3 returns JSON instead of XML (v1)
• Enhanced Endpoints:
  • /clubs - Get all clubs with pagination
  • /competitions/{competitionCode}/statistics/players/traditional - Player traditional stats
  • /competitions/{competitionCode}/statistics/players/advanced - Player advanced stats
  • /competitions/{competitionCode}/statistics/players/scoring - Player scoring stats
  • /competitions/{competitionCode}/statistics/players/misc - Player misc stats
  • /competitions/{competitionCode}/statistics/players/leaders - Player leaders
  • /competitions/{competitionCode}/seasons/{seasonCode}/rounds/{roundNumber}/basicstandings - Basic standings
  • /competitions/{competitionCode}/seasons/{seasonCode}/rounds/{roundNumber}/calendarstandings - Calendar standings
  • /competitions/{competitionCode}/seasons/{seasonCode}/rounds/{roundNumber}/streaks - Streak standings
  • /competitions/{competitionCode}/seasons/{seasonCode}/rounds/{roundNumber}/aheadbehind - Ahead/Behind standings
  • /competitions/{competitionCode}/seasons/{seasonCode}/rounds/{roundNumber}/margins - Margins standings
  • /competitions/{competitionCode}/seasons/{seasonCode}/games/{gameCode}/report - Game reports
  • /competitions/{competitionCode}/seasons/{seasonCode}/games/{gameCode}/stats - Game stats
  • /competitions/{competitionCode}/seasons/{seasonCode}/games/{gameCode}/teamsComparison - Teams comparison
• No authentication required (public API)

• React 18.2.0: UI framework
• TypeScript: Type safety
• Chart.js: Data visualization
• Val Town: Deployment platform (Deno-compatible)
• API v3: JSON-based API (migrated from v1 XML)

• FilterControls: Season, phase, team, and data type selectors
• StatsTable: Sortable, paginated data table
• Charts: Player comparison visualizations
• DownloadButton: CSV export functionality

• Caching: In-memory cache for API responses (5-minute TTL)
• Error Handling: User-friendly error messages with retry functionality
• Loading States: Visual feedback during data fetching
• Responsive Design: Mobile-friendly layout
• Accessibility: ARIA labels, keyboard navigation, screen reader support
• API v3 Migration: Full migration from XML (v1) to JSON (v3) with enhanced data models
• Rich Data Models: Support for advanced stats, scoring stats, misc stats, and multiple standings views

The application has been fully migrated from API v1 to v3:

• Response Format: XML → JSON
• Base URL: /v1 → /v3
• Endpoints: Updated to use new v3 endpoint structure
• Data Models: Enhanced with additional fields and nested structures
• New Features: Access to advanced stats, scoring stats, misc stats, and multiple standings views

Comprehensive tests are available in tests/api-v3.test.ts:

• Tests for all major v3 endpoints
• Validates JSON response format
• Checks data structure and content
• Error handling tests

Run tests with:

deno test tests/api-v3.test.ts --allow-net

The CSV export includes:

• All visible columns from the current table view
• Proper CSV escaping (handles commas, quotes, newlines)
• UTF-8 BOM for Excel compatibility
• Filename includes filters (e.g., players_2024-25_Regular_Season.csv)

• Modern browsers (Chrome, Firefox, Safari, Edge)
• Mobile browsers (iOS Safari, Chrome Mobile)
• Requires JavaScript enabled

This project is provided as-is for educational and personal use.

For issues or questions:

1. Check the Euroleague API documentation
2. Review the code comments in main.tsx
3. Check browser console for errors