diff --git a/index.html b/index.html index 9a400d1..9df5357 100644 --- a/index.html +++ b/index.html @@ -1,21 +1,122 @@ - + - TV Show Project | My Name (My GitHub username) + TV Show Project | Damilola Odumosu (d-odumosu) - - -
-
+
+ +

+ + +
+ +
+
+ + + +
+ + +

+
+ + + + +
+
+ + +
+
+
+ +
+ +
+

+

+
+
+ + +
+
+ + + +
+ + +
+ + + + + +
+
+
- - + - + diff --git a/script.js b/script.js index 87a7de8..e107be2 100644 --- a/script.js +++ b/script.js @@ -1,12 +1,51 @@ -//You can edit ALL of the code here -function setup() { - const allEpisodes = getAllEpisodes(); - makePageForEpisodes(allEpisodes); -} +const appState = { + shows: [], + episodes: [], + episodesCache: new Map(), + selectedShow: "", + selectedEpisode: "", + episodeSearchTerm: "", + showSearchTerm: "", + currentView: "shows", +}; + +// -------------------------- +// API / FETCH FUNCTIONS +// -------------------------- -function makePageForEpisodes(episodeList) { - const rootElem = document.getElementById("root"); - rootElem.textContent = `Got ${episodeList.length} episode(s)`; +async function getShows() { + const url = "https://api.tvmaze.com/shows"; + try { + const response = await fetch(url); + if (!response.ok) { + throw new Error(`Response status: ${response.status}`); + } + + appState.shows = await response.json(); + return true; + } catch (error) { + console.error(error.message); + return false; + } } -window.onload = setup; +async function getShowEpisodes(showId) { + if (appState.episodesCache.has(appState.selectedShow)) { + appState.episodes = appState.episodesCache.get(appState.selectedShow); + return true; + } else { + const url = `https://api.tvmaze.com/shows/${showId}/episodes`; + try { + const response = await fetch(url); + if (!response.ok) { + throw new Error(`Response status: ${response.status}`); + } + appState.episodes = await response.json(); + appState.episodesCache.set(appState.selectedShow, appState.episodes); + return true; + } catch (error) { + console.error(error.message); + return false; + } + } +}