Free javascript Hosting


moviefight.js

Uploaded on Jan 26 2022 03:15 by ajitsinghsrk

const createAutoCompleteConfig= {
renderOption(movie)
{
const imgSrc=movie.Poster==="N/A"?" ":movie.Poster;
return `<img src="${imgSrc}" width="34px" height="50px" float="right">${movie.Title}(${movie.Year})`;

},

inputValueFun(movie)
{return movie.Title;},
async fetchData (title)
{
response= await axios.get("http://www.omdbapi.com/",
{
params:
{
apikey:"3d7ee8b",
s:title
}
})
if(response.data.Error)
{
return [];
}
return response.data.Search;
}
};


createAutocomplete({...createAutoCompleteConfig,root:document.querySelector("#left-autocomplete"), onOptionSelect(movie)
{
onMovieSelect(movie,document.querySelector("#left-summary"));
document.querySelector(".tutorial").classList.add("is-hidden");
}});
createAutocomplete({...createAutoCompleteConfig,root:document.querySelector("#right-autocomplete"), onOptionSelect(movie)
{
onMovieSelect(movie,document.querySelector("#right-summary"));
document.querySelector(".tutorial").classList.add("is-hidden");
}});

const movieTemplate=movieDetails=>
{

return ` <article class="media">
<figure class="media-left">
<p class="image">
<img src="${movieDetails.Poster}">
</p>
</figure>
<div class="media-content">
<div class="content">
<h2>${movieDetails.Title}</h2>
<h4>${movieDetails.Genre} </h4>
<p>${movieDetails.Plot}</p>
</div>
</div>
</article>
<article class="notification is-primary">
<p class="title">${movieDetails.Awards}</p>
<p class="subtitle">Awards </p>
</article>
<article class="notification is-primary">
<p class="title">${movieDetails.BoxOffice}</p>
<p class="subtitle">BoxOffice </p>
</article>
<article class="notification is-primary">
<p class="title">${movieDetails.Metascore}</p>
<p class="subtitle">MetaScore </p>
</article>
<article class="notification is-primary">
<p class="title">${movieDetails.imdbRating}</p>
<p class="subtitle">IMDB Rating </p>
</article>
<article class="notification is-primary">
<p class="title">${movieDetails.imdbVotes}</p>
<p class="subtitle">Votes </p>
</article>

`
}

Back to list