Skip to content

Movie details on hover

Jump to bottom
Ondra Hlaváč edited this page Dec 23, 2023 · 1 revision

Objective

When user hovers over a text, that resembles a movie name, e.g. a torrent file name, we want to fetch and show details about the movie, including the poster and description.

How to do it

  • Store personal TMDB API key in userscript keyval store
  • For predetermined page elements, find movie (or tv show) name in its HTML.
  • Cleanup the string and get all the helpful data from it - name, year, media type (i.e. movie or tv)
  • Search for the movie on TMDB API
  • Display found movie details in floating card on page
  • Show nothing if movie could not be found
  • Cache retrieved data to prevent needless calls to the API

Future enhancements

  • store TMDB lookup cache in UserScript keyval store
  • ask for TMDB api key if none stored in UserScript keyval store
  • show rating of the movie/tv series
  • optimize search using the year of the release
  • cleanup - make sure functions do just one thing
  • cleanup - templating
  • cleanup - correct use of async functions and event driven display of search results
  • get API configuration as the first call to the API (baseUrl et al)

Clone this wiki locally