Frappe Movie Search Demo

movie_search.dart

ObservableList movieSuggestions = new ObservableList();

var searchInput = document.querySelector("#search-input");

var onInput = new EventStream(searchInput.onKeyUp).merge(searchInput.onChange)
    .map((_) => searchInput.inputValue)
    .debounce(new Duration(milliseconds: 250))
    .distinct();

var suggestions = onInput.flatMapLatest((search) {
  var results = search.length >= 3 ? _queryMovies(search) : new Future.value([]);
  return results.asStream();
});

suggestions.forEach((suggestions) =>
    movieSuggestions
        ..clear()
        ..addAll(suggestions.take(10)));

Future<List<String>> _queryMovies(String search) {
  var uri = new Uri(host: "api.themoviedb.org", path: "3/search/movie", queryParameters: {
    "api_key": "9eae05e667b4d5d9fbb75d27622347fe",
    "query": search
  });
  
  return HttpRequest.getString(uri.toString())
      .then((result) => JSON.decode(result)["results"]);
}