import debounce from "./helpers.js"

class View {
	constructor(){
		this.listMovies = document.querySelector("#list-movies")
		this.inputSearch = document.querySelector("input")
		this.loader = document.querySelector(".loader")
		this.message = document.querySelector("p.error")
	}

	#getInput(){
		return this.inputSearch.value
	}

	setLoading(loading){
		if (loading)
			this.loader.style.display = "block"
		else
			this.loader.style.display = "none"
	}

	renderMessage(error){
		this.message.style.display = "block"
		this.message.textContent = error
	}

	renderList(movies){
		let ul = document.createElement("ul")

		movies.forEach((movie)=>{
			// TODO
		})

		this.listMovies.replaceChildren(ul)
	}

	bindSearch(handler){
		this.inputSearch.addEventListener("input",debounce((e)=>{
			handler(this.#getInput())	
		},500))
	}
}

export default View
