EftelTimes

Queue times application for the Efteling theme park. Built with React and Django.

A fan-made project, not affiliated with the Efteling.

Features

• 🎢 Real-time queue times for all attractions
• ⏱️ Single rider wait times
• 🎪 Attraction status (open, closed, maintenance)
• 🌐 Multi-language support
• 🎨 Beautiful, theme-park inspired design

Project Structure

.
├── frontend/           # React application
│   ├── src/
│   │   ├── components/
│   │   ├── pages/
│   │   └── store/     # Redux store
│   └── ...
└── backend/           # Django API
    ├── efteltimes/   # Django project
    └── queues/       # Queue times app

Development Setup

Frontend

cd frontend
npm install
npm run dev

The frontend will be available at http://localhost:5173

Backend

cd backend
pipenv install
pipenv shell
python manage.py runserver

The API will be available at http://localhost:8000

API Endpoints

• GET /api/v1/queues/ - Get all queue times

  {
    "last_updated": "2024-04-15T21:00:00Z",
    "source": "tpw-api",
    "entities": {
      "attractions": [
        {
          "name": "Python",
          "waitTime": 15,
          "singleRider": {
            "available": true,
            "waitTime": 5
          },
          "status": "open"
        }
      ]
    }
  }

Environment Variables

Frontend

VITE_API_URL=http://localhost:8000

Backend

DEBUG=True
USE_DUMMY_DATA=True  # Set to False for real API

Roadmap

✅ Phase 1: Project Foundation

• Folder structure created: /frontend and /backend
• Vite + React frontend scaffolded
• Django backend scaffolded using Pipenv
• TailwindCSS and styled-components set up
• Redux Toolkit and React Router configured
• Django REST Framework and CORS configured
• File-based caching set up in Django

🎨 Phase 2: UI & Component Architecture

• Project folders organized (components/, layouts/, pages/, store/, etc.)

UI Components (Presentational)

• Build reusable UI components:
  • Time display component
  • Status indicator component
  • Entity row component
• Additional UI components:
  • Tag components for status/type
  • Card components for attraction details
  • Loading and error state components

Layout Components

• Create layout components:
  • Page container with consistent spacing
  • Header component with park status
  • Responsive grid system
  • Footer component
  • Section container components

Page Components

• HomePage component:
  • Data fetching and state management
  • Layout assembly
  • UI component integration
  • Responsive design

🔌 Phase 3: API Integration

• Switch from Python wrapper to direct ThemeParks API usage
• Set up /api/v1/queues/ endpoint
• Extract: name, status, wait times, area, type, translations
• Include last_updated timestamp
• Cache backend response for 60 seconds
• Connect frontend to live data using RTK Query
• Transform API data for frontend consumption
• Add opening hours endpoint and integration
• Handle timezone differences correctly

🧠 Phase 4: UX & State Features

• Add loading and error handling
• Implement global state for queue data
• Smart status display based on park hours

🚀 Phase 5: Final Touches & Deployment

• Add favicon and page title
• Add legal/fan disclaimer in the footer
• Optimize layout for mobile
• Deploy backend to VPS with Nginx
• Deploy frontend (same VPS or static host)

🎯 Phase 6: Future Improvements

• Toggle and button components
• Add toggle for grouping by area
• Default: grouped on desktop, flat on mobile
• Favoriting functionality
• Search/filter functionality
• Dark mode support
• Winter theme
• Internationalization:
  • English version
  • Language switcher
  • Automatic language detection
• German localization
• Additional pages:
  • Attraction detail pages with history
  • Settings page for preferences
  • About page with project info
• Improved data visualization:
  • Wait time trends
  • Peak hours indication
  • Historical data analysis

License

MIT License - See LICENSE file for details