WatchWheel is a browser-based movie picker that uses TMDb to help you discover movies based on custom filters, then randomly selects one from your results.
- Dynamic filter options loaded from TMDb (genres, languages, people, streaming regions)
- Filtered movie discovery using TMDb's
discover/movieendpoint - Manual movie title additions to the candidate list
- Random movie picker with poster preview
- Three-column UI for filtering, candidate list, and final selection
- HTML (single-page layout in
default.html) - Vanilla JavaScript (
get-criteria.js,get-movies.js,select-movie.js) - CSS (currently mostly inline styles in
default.html;style.cssexists and is empty) - TMDb REST API
default.html: Main app layout and script includesget-criteria.js: Loads filter criteria from TMDb and wires UI interactionsget-movies.js: Handles filter form submission, movie fetches, and movie list renderingselect-movie.js: Randomly picks a movie from the current list and displays poster/titlestyle.css: Reserved stylesheet file (currently empty)assets/: Static images (includes placeholder question-mark image)
- TMDb API Read Access Token
- Get your TMDb API Read Access Token from your TMDb account settings.
- Create a file called "API-read-access-token.txt" containing the TMDb API key and place it in your home directory:
- Run the app through a local static server and
default.html.
- In the left column, configure your movie criteria and click Submit.
- In the middle column, review generated movie candidates.
- Optionally add manual titles using the add box.
- Click Random Movie in the right column.
- WatchWheel shows the selected title and poster (when available).
- Runtime and rating filter input names may not align with TMDb discover parameter names yet.
- Studio filtering is present as commented TODO code.
- Make Spinning Wheel in the center to make the application more interactive
- Create a logo
- Add client-side validation for filter ranges
- Fix the studio API call
- Add loading states and empty-state messaging
- Add pagination or "load more" for discover results, create counter to show how many results there are
- Add persistent saved filter presets
- Have confetti appear when the user finds a movie to watch
- Replace client-side token usage with backend-proxied API calls