-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathmovies.js
97 lines (66 loc) · 2.15 KB
/
movies.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
const Apiurl ="https://api.themoviedb.org/3/discover/movie?sort_by=popularity.desc&api_key=04c35731a5ee918f014970082a0088b1&page=1";
const searchApi ="https://api.themoviedb.org/3/search/movie?&api_key=04c35731a5ee918f014970082a0088b1&query=";
const ImgPath = "https://image.tmdb.org/t/p/w1280";
const main = document.getElementById("main");
const form = document.getElementById('form');
const search = document.getElementById("search");
getmovies(Apiurl);
async function getmovies(url){
const resp = await fetch(url);
const respData = await resp.json();
addmovie(respData.results);
}
function addmovie(movies){
//clear main
main.innerHTML = '';
movies.forEach((movie) => {
const {poster_path, title, vote_average,overview}= movie;
const movieE1 = document.createElement("div");
movieE1.classList.add("movie");
movieE1.innerHTML = `
<img src="${ImgPath +poster_path}" alt="${title}" >
<div class="movie-info">
<h3>
${ title}
</h3>
<span class="${getClassByRate(vote_average)}">${vote_average}</span>
</div>
<div class="overview"><h4>Overview:</h4>
${overview}</div>
`;
//const img = document.createElement("img");
// img.src = ImgPath + movie.poster_path;
main.appendChild(movieE1);
});
}
function getClassByRate(vote){
if(vote >=8){
return 'green';
}
else if(vote >= 5){
return 'orange';
}
else {
return 'red';
}
}
form.addEventListener('submit',(e)=>{
e.preventDefault();
const searchTerm = search.value;
if(searchTerm){
getmovies(searchApi + searchTerm);
search.value='';
}
});
/*async function showMovies(){
const succ = await fetch(Apiurl);
const succdata = await succ.json();
console.log(succdata);
succdata.results.forEach((movie)=>{
const photo = document.createElement("img");
photo.src = ImgPath + movie.poster_path;
document.body.appendChild(photo);
})
return succdata;
}*/
//showMovies();