From 74806e2e49a6bc6c06fb0ba6db46bc8b310469c3 Mon Sep 17 00:00:00 2001 From: yann Date: Sun, 9 Mar 2025 17:45:04 +0100 Subject: [PATCH] fix block generation --- index2.html | 104 --------------------- script.js | 14 ++- style.css | 0 test.js | 47 ---------- test2.js | 263 ---------------------------------------------------- 5 files changed, 9 insertions(+), 419 deletions(-) delete mode 100644 index2.html delete mode 100644 style.css delete mode 100644 test.js delete mode 100644 test2.js diff --git a/index2.html b/index2.html deleted file mode 100644 index 8b226b9..0000000 --- a/index2.html +++ /dev/null @@ -1,104 +0,0 @@ - - - - - - JustStreamIt - - - - - - - - -
-
-
-
- logo -
-
-

Vidéos à la demande

-
-
-
-
- -
-
-

Meilleur film

-
-
- -
-
-
- -
-
-

Best rated

-
- -
-
- -
-
- -
-
-
- -
-
-

Mystery

-
- -
-
- -
- -
-
- -
- -
-
-
- - - - - - - - diff --git a/script.js b/script.js index a6fb8ad..0fc39b0 100644 --- a/script.js +++ b/script.js @@ -302,6 +302,7 @@ more.addEventListener("click", ()=> { addSeeLess("bestRated", "d-block"); }) }) +let less = document.getElementById("bestRated"); less.addEventListener("click", ()=> { bestRated.then((data) => { @@ -315,19 +316,22 @@ less.addEventListener("click", ()=> { window.addEventListener("resize", ()=> { generateMovies(bestRated, "bestRated") }) - - - - +// ============ Mystery ============ +let mystery = getMovies3("?genre=mystery") +generateMovies(mystery, "mystery") // fill the selection menu getCategory(); +let other = getMovies3("?genre=action"); +generateMovies(other, "other"); // listen for any change in menu let selectedItem = document.getElementById("category-select"); selectedItem.addEventListener("change", ()=> { - getMovies(`?genre=${selectedItem.value}`, "other"); +// getMovies(`?genre=${selectedItem.value}`, "other"); + let block = getMovies3(`?genre=${selectedItem.value}`); + generateMovies(block, "other"); }); diff --git a/style.css b/style.css deleted file mode 100644 index e69de29..0000000 diff --git a/test.js b/test.js deleted file mode 100644 index 3f91394..0000000 --- a/test.js +++ /dev/null @@ -1,47 +0,0 @@ - -function getBestFilm() { - let bestFilmTitle = document.querySelector(".title h2") - console.log(bestFilmTitle.textContent) -} - -getBestFilm() - -async function afficherFilms() { - for (let j = 1; j<10; j++) { - const response = await fetch(`http://localhost:8000/api/v1/titles/?format=json&page=${j}`); - const film = await response.json(); - for (let i in film.results) { - console.log(film.results[i].title); - } -//return response.json(); - } -} - -bestFilm() -let bestTitle = document.querySelector(".title h2") -console.log(bestTitle) -let bestPic = document.querySelector(".affiche img") -let bestDesc = document.getElementById("description") -console.log(bestPic) - -async function bestFilm() { - const response = await fetch("http://localhost:8000/api/v1/titles/118710") - const film = await response.json(); - bestTitle.innerText = film.original_title - bestPic.setAttribute("src", film.image_url) - bestDesc.innerText = film.description - let detailHeader = ` -

${film.original_title}

-

${film.year} - ${film.genres}

- ` -let modalHeader = document.getElementById("modalHeader") -console.log(modalHeader) -modalHeader.innerHTML = detailHeader - console.log(film) -} - - - -//afficherFilms() -// console.log(film) - diff --git a/test2.js b/test2.js deleted file mode 100644 index 8111cb7..0000000 --- a/test2.js +++ /dev/null @@ -1,263 +0,0 @@ -const url_title = "http://localhost:8000/api/v1/titles/"; -const url_genre = "http://localhost:8000/api/v1/genres/"; - -const blockEnd = ` - - - -`; - -// construct button "see more" or "see less" -function getButtonSee(what) { - let see = ` -
- -
- `; - return see; -} - - -async function getMovies(url, id) { - const filmList = []; - - for (let j=1; j<3; j++) { - const response = await fetch(`${url_title}${url}&format=json&page=${j}`); - const film1 = await response.json(); - for (i in film1.results) { - filmList.push(film1.results[i]); - } - } - - let blockToLook = document.getElementById(id); - blockToLook.innerHTML = ""; - - for (let i = 0; i < 6; i++) { - film = filmList[i]; - let movieBlock = ` -
-
-
-
-
-

${film.title}

-
-
- - - `; - // retrieve the specific film detail from URL using id then concatenate with the modal creator - const response2 = await fetch(`${url_title}${film.id}`); - const film2 = await response2.json(); - let modal = getModalDetail(film2, film2.id); - - blockToLook.innerHTML += movieBlock+modal+blockEnd; - } -} - -// tried to make some dynamic pagination browsing... nok -async function getCount(type) { - const response = await fetch(`http://localhost:8000/api/v1/${type}`); - const result = await response.json(); - return result; -} - -// get categories and create the options in select menu -async function getCategory() { - listeGenres = []; - for (let i = 1; i<6; i++) { - const response = await fetch(`${url_genre}?page=${i}`); - const genres = await response.json(); - for (let j in genres.results) { - listeGenres.push(genres.results[j].name); - }; - } - let categorySelect = document.getElementById("category-select"); - for (i in listeGenres) { - let option = ` - - `; - categorySelect.innerHTML += option; - } -} - -// create the best film block and get a movie from a given ID -async function bestFilm(filmId) { - const response = await fetch(`${url_title}${filmId}`); - const bfilm = await response.json(); - - let detail = ` -
-
- film cover -
-
-
-

${bfilm.title}

-
${bfilm.description}
-
- -
-
-
- `; - let modal = getModalDetail(bfilm, bfilm.id); - document.getElementById("bestFilm").innerHTML += detail+modal; - -} - -// create the modal HTML block for a given film object -function getModalDetail(film, modalId) { - let recette = "N/A"; - let genre = recette; - - if (film.worldwide_gross_income) { - recette = film.worldwide_gross_income; - } - if (film.genre) { - genre = film.genre; - } - let modalContent = ` -