Skip to content

Commit 55c9817

Browse files
ashmalzahraashmalzahra
committed
modify code and API
1 parent ab1447c commit 55c9817

File tree

6 files changed

+76
-79
lines changed

6 files changed

+76
-79
lines changed

‎src/index.html‎

Lines changed: 62 additions & 54 deletions
Original file line numberDiff line numberDiff line change
@@ -1,60 +1,68 @@
11
<!DOCTYPE html>
22
<html lang="en">
3-
4-
<head>
5-
<meta charset="UTF-8" />
6-
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
7-
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
8-
<script src="https://kit.fontawesome.com/db139aff16.js" crossorigin="anonymous"></script>
9-
<title>Tv Shows</title>
10-
</head>
11-
12-
<body>
13-
<header>
14-
<nav>
15-
<ul>
16-
<li><i class="fa-solid fa-circle-play"></i></li>
17-
<a href="index.html">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<script
8+
src="https://kit.fontawesome.com/db139aff16.js"
9+
crossorigin="anonymous"
10+
></script>
11+
<title>Document</title>
12+
</head>
13+
<body>
14+
<header>
15+
<nav>
16+
<ul>
17+
<li><i class="fa-solid fa-circle-play"></i></li>
1818
<li class="count-shows"></li>
19-
</a>
20-
<li>Best of 2022</li>
21-
<li>Mark your Calender</li>
22-
</ul>
23-
</nav>
24-
</header>
25-
<main class="container"></main>
26-
<div class="comment_pop-up_container hidden">
27-
<div class="comment_main-content">
28-
<section class="description_content">
29-
<img id="comment-image" src="" alt="" />
30-
<button id="close-btn">⨯</button>
31-
<h2 class="description_content__movie_title"></h2>
32-
<div class="rating-genres"></div>
33-
<h3>Description:</h3>
34-
<p id="description"></p>
35-
</section>
19+
<li>Best of 2022</li>
20+
<li>Mark your Calender</li>
21+
</ul>
22+
</nav>
23+
</header>
24+
<main class="container"></main>
3625

37-
<section class="comments-section">
38-
<h3>Comments (N)</h3>
39-
<div class="comments-container"></div>
40-
<div class="add-comments-container">
41-
<h3>Add a comment</h3>
42-
<form id="form" action="" method="post">
43-
<input id="comment-user-name-input" type="text" placeholder="Your name" />
44-
<textarea name="comment" id="textArea-comment" cols="30" rows="3" placeholder="Your insights"></textarea>
45-
<button id="btn-input-comment">Comment</button>
46-
</form>
47-
</div>
48-
</section>
49-
</div>
50-
</div>
51-
</div>
52-
</body>
26+
<div class="comment_pop-up_container hidden">
27+
<div class="comment_main-content">
28+
<section class="description_content">
29+
<img id="comment-image" src="" alt="" />
30+
<button id="close-btn">⨯</button>
31+
<h2 class="description_content__movie_title"></h2>
32+
<div class="rating-genres"></div>
33+
<h3>Description:</h3>
34+
<p id="description"></p>
35+
</section>
5336

54-
<footer>
55-
<div class="footer_content">
56-
<p class="footer-description">Created by Microverse under CC license</p>
57-
</div>
58-
</footer>
37+
<section class="comments-section">
38+
<h3 id="comments-header">Comments (N)</h3>
39+
<div class="comments-container"></div>
40+
<div class="add-comments-container">
41+
<h3>Add a comment</h3>
42+
<form id="form" action="" method="post">
43+
<input
44+
id="comment-user-name-input"
45+
type="text"
46+
placeholder="Your name"
47+
/>
48+
<textarea
49+
name="comment"
50+
id="textArea-comment"
51+
cols="30"
52+
rows="3"
53+
placeholder="Your insights"
54+
></textarea>
55+
<button id="btn-input-comment">Comment</button>
56+
</form>
57+
</div>
58+
</section>
59+
</div>
60+
</div>
61+
</body>
5962

60-
</html>
63+
<footer>
64+
<div class="footer_content">
65+
<p>Created by Microverse under CC license</p>
66+
</div>
67+
</footer>
68+
</html>

‎src/index.js‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
11
import './style.css';
2-
import displayShows from './modules/homepage';
2+
import './modules/homepage.js';
33
import './modules/comment_handler.js';
4-
import './modules/comments-button_handler.js';
5-
6-
displayShows();
4+
import './modules/comments-button_handler.js';

‎src/modules/api.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
// TVMaze API
22
const showData = async (query) => {
3-
// const url = `https://api.tvmaze.com/shows/${query}`;
4-
const url = `https://api.tvmaze.com/singlesearch/shows?q=${query}`;
3+
const url = `https://api.tvmaze.com/shows/${query}`;
4+
// const url = `https://api.tvmaze.com/singlesearch/shows?q=${query}`;
55
const response = await fetch(url);
66
const data = await response.json();
77
return data;

‎src/modules/comment_handler.js‎

Lines changed: 1 addition & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,6 @@
11
import { showData, showDataInvolvement, postComment } from './api.js';
22
// import showDataInvolvement from './comments-pop-up-comments-section_handler.js';
33

4-
const showDataPopUp = async (query) => {
5-
const url = `https://api.tvmaze.com/singlesearch/shows/${query}`;
6-
const response = await fetch(url);
7-
const data = await response.json();
8-
return data;
9-
};
10-
114
const getDescription = async (id) => {
125
const data = await showData(id);
136

@@ -78,4 +71,4 @@ form.onsubmit = (e) => {
7871
form.reset();
7972
};
8073

81-
export { getDescription, getComments };
74+
export { getDescription, getComments };

‎src/modules/comments-button_handler.js‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,7 @@ window.addEventListener('load', () => { // Waits until page is loaded completel
77
// const id = document.querySelector('.description_content__movie_title');
88
btnComments.forEach((element) => {
99
element.addEventListener('click', () => {
10-
console.log('enter');
11-
//getDescription(element.parentElement.id);
12-
getDescription(element.previousElementSibling.firstElementChild.textContent);
10+
getDescription(element.parentElement.id);
1311
// getComments(element.previousElementSibling.firstElementChild.textContent);
1412
getComments(element.parentElement.id);
1513
// getComments(id.textContent);
@@ -73,4 +71,4 @@ document.addEventListener('DOMContentLoaded', () => {
7371
popUpContainer.classList.toggle('hidden');
7472
});
7573
});
76-
*/
74+
*/

‎src/modules/homepage.js‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@ import { showData, getLikes } from './api';
22
// involvement API for POST
33
const url = 'https://us-central1-involvement-api.cloudfunctions.net/capstoneApi/apps/OX5sTwXK5eU2vy1wOpri/likes';
44

5-
// const shows = [27436, 39749, 17861, 2993, 43687, 47549]; // TVmaze ids
6-
const tvShows = ['La Casa de Papel', '1899', 'Dark', 'Stranger Things', 'Squid Game', 'Ginny & Georgia'];
5+
const shows = [27436, 39749, 17861, 2993, 43687, 47549]; // TVmaze ids
6+
// const tvShows = ['La Casa de Papel', '1899', 'Dark', 'Stranger Things', 'Squid Game', 'Ginny & Georgia'];
77

88
const show = [];
99

@@ -13,12 +13,12 @@ const showsCount = async () => {
1313
addCount.innerHTML = `Top binge-worthy shows (${shows})`;
1414
};
1515

16-
export const showInfo = async () => {
17-
for (let i = 0; i < tvShows.length; i += 1) {
16+
const showInfo = async () => {
17+
for (let i = 0; i < shows.length; i += 1) {
1818
/*eslint-disable */
1919

2020
//suppress all warnings between comments
21-
const data = await showData([tvShows[i]]);
21+
const data = await showData([shows[i]]);
2222

2323
/* eslint-enable */
2424
show.push(data);
@@ -68,7 +68,7 @@ const displayShows = async () => {
6868
container.innerHTML = '';
6969
for (let i = 0; i < show.length; i += 1) {
7070
container.innerHTML += `
71-
<article class="article">
71+
<article class="article" id="${show[i].id}">
7272
<img src=${show[i].image.medium}>
7373
<div class="title" id="${show[i].id}">
7474
<h2>${show[i].name}</h2>
@@ -85,4 +85,4 @@ const displayShows = async () => {
8585
showsCount();
8686
};
8787

88-
export default displayShows;
88+
displayShows();

0 commit comments

Comments
 (0)