Skip to content

Commit cdd6812

Browse files
drdicdrdic
authored
Merge pull request #8 from drdic/hw-6
hw-6
2 parents b1329f9 + 04055d2 commit cdd6812

File tree

11 files changed

+258
-168
lines changed

11 files changed

+258
-168
lines changed

‎index.html‎

Lines changed: 37 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,33 +1,40 @@
1-
<!DOCTYPE html>
1+
<!doctype html>
22
<html>
3+
<head>
4+
<title>Проект "Комменты"</title>
5+
<meta charset="utf-8" />
6+
<link rel="stylesheet" href="styles.css" />
7+
</head>
38

4-
<head>
5-
<title>Проект "Комменты"</title>
6-
<meta charset="utf-8" />
7-
<link rel="stylesheet" href="styles.css" />
8-
</head>
9+
<body>
10+
<div class="container">
11+
<ul class="comments">
12+
<!-- Комментарии будут загружаться через JavaScript -->
13+
</ul>
14+
<div id="comments-loading" class="loading">
15+
Пожалуйста подождите, загружаю комментарии...
16+
</div>
17+
<div id="form-loading" class="loading" style="display: none">
18+
Комментарий добавляется...
19+
</div>
20+
<div class="add-form">
21+
<input
22+
type="text"
23+
class="add-form-name"
24+
placeholder="Введите ваше имя"
25+
/>
26+
<textarea
27+
type="textarea"
28+
class="add-form-text"
29+
placeholder="Введите ваш коментарий"
30+
rows="4"
31+
></textarea>
32+
<div class="add-form-row">
33+
<button class="add-form-button">Написать</button>
34+
</div>
35+
</div>
36+
</div>
37+
</body>
938

10-
<body>
11-
<div class="container">
12-
<ul class="comments">
13-
<!-- Комментарии будут загружаться через JavaScript -->
14-
</ul>
15-
<div id="comments-loading" class="loading">
16-
Пожалуйста подождите, загружаю комментарии...
17-
</div>
18-
<div id="form-loading" class="loading" style="display: none;">
19-
Комментарий добавляется...
20-
</div>
21-
<div class="add-form">
22-
<input type="text" class="add-form-name" placeholder="Введите ваше имя" />
23-
<textarea type="textarea" class="add-form-text" placeholder="Введите ваш коментарий" rows="4"></textarea>
24-
<div class="add-form-row">
25-
<button class="add-form-button">Написать</button>
26-
</div>
27-
</div>
28-
</div>
29-
</body>
30-
31-
<script type="module" src="./main.js"></script>
32-
33-
</html>
39+
<script type="module" src="./main.js"></script>
40+
</html>

‎main.js‎

Lines changed: 19 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,29 @@
1-
import { comments } from './modules/data.js';
2-
import { getComments } from './modules/api.js';
3-
import { renderComments } from './modules/render.js';
4-
import { initAddCommentListener } from './modules/listeners.js';
5-
import { showGlobalLoading, hideGlobalLoading } from './modules/loaders.js';
1+
import { comments } from './modules/data.js'
2+
import { getComments } from './modules/api.js'
3+
import { renderComments } from './modules/render.js'
4+
import { initAddCommentListener } from './modules/listeners.js'
5+
import { showGlobalLoading, hideGlobalLoading } from './modules/loaders.js'
66

77
async function loadComments() {
88
try {
9-
showGlobalLoading();
10-
11-
const freshComments = await getComments();
12-
comments.length = 0;
13-
comments.push(...freshComments);
14-
renderComments();
15-
9+
showGlobalLoading()
10+
11+
const freshComments = await getComments()
12+
comments.length = 0
13+
comments.push(...freshComments)
14+
renderComments()
1615
} catch (error) {
17-
console.error('Ошибка загрузки комментариев:', error);
18-
const commentsList = document.querySelector('.comments');
19-
commentsList.innerHTML = '<div class="error">Не удалось загрузить комментарии</div>';
16+
console.error('Ошибка загрузки комментариев:', error)
17+
const commentsList = document.querySelector('.comments')
18+
commentsList.innerHTML =
19+
'<div class="error">Не удалось загрузить комментарии</div>'
2020
} finally {
21-
hideGlobalLoading();
21+
hideGlobalLoading()
2222
}
2323
}
2424

2525
// Запуск приложения
26-
loadComments();
27-
initAddCommentListener();
26+
loadComments()
27+
initAddCommentListener()
2828

29-
export { loadComments };
29+
export { loadComments }

‎modules/api.js‎

Lines changed: 70 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,76 @@
1-
const API_BASE_URL = "https://wedev-api.sky.pro/api/v1";
2-
const PERSONAL_KEY = "eduard-zakharevskiy";
3-
const API_URL = `${API_BASE_URL}/${PERSONAL_KEY}/comments`;
1+
const API_BASE_URL = 'https://wedev-api.sky.pro/api/v1'
2+
const PERSONAL_KEY = 'eduard-zakharevskiy'
3+
const API_URL = `${API_BASE_URL}/${PERSONAL_KEY}/comments`
44

55
export async function getComments() {
6-
const response = await fetch(API_URL);
7-
if (!response.ok) throw new Error('Ошибка загрузки');
8-
const data = await response.json();
9-
return data.comments;
10-
}
6+
try {
7+
const response = await fetch(API_URL)
8+
9+
// обработка статусов для GET запроса
10+
if (response.status === 500) {
11+
throw new Error('Сервер сломался, попробуй позже')
12+
}
1113

12-
export async function addComment({ name, text }) {
13-
const response = await fetch(API_URL, {
14-
method: 'POST',
15-
body: JSON.stringify({ name, text })
16-
});
14+
if (!response.ok) {
15+
throw new Error(`Ошибка загрузки: ${response.status}`)
16+
}
1717

18-
if (!response.ok) {
19-
const errorData = await response.json();
20-
throw new Error(errorData.error || 'Ошибка сервера');
18+
const data = await response.json()
19+
return data.comments
20+
} catch (error) {
21+
console.error('Ошибка при загрузке комментариев:', error)
22+
throw error // прокидываем ошибку дальше
2123
}
24+
}
25+
26+
export async function addComment(
27+
{ name, text, forceError = false },
28+
retryCount = 0,
29+
) {
30+
const maxRetries = 2 // максимально 2 повторные попытки
31+
32+
try {
33+
const response = await fetch(API_URL, {
34+
method: 'POST',
35+
body: JSON.stringify({ name, text, forceError }),
36+
})
37+
38+
// обработка HTTP статусов
39+
if (response.status === 500) {
40+
// если есть еще попытки, повторяем
41+
if (retryCount < maxRetries) {
42+
console.log(
43+
`Сервер вернул 500, повторяем попытку ${retryCount + 1}/${maxRetries}`,
44+
)
45+
// ждем 1 сек перед повторной попыткой
46+
await new Promise((resolve) => setTimeout(resolve, 1000))
47+
return addComment({ name, text, forceError }, retryCount + 1)
48+
}
49+
throw new Error('Сервер сломался, попробуй позже')
50+
}
2251

23-
return await response.json();
24-
}
52+
if (response.status === 400) {
53+
throw new Error(
54+
'Имя и комментарий должны быть не короче 3 символов',
55+
)
56+
}
57+
58+
if (!response.ok) {
59+
throw new Error(`Ошибка сервера: ${response.status}`)
60+
}
61+
62+
return await response.json()
63+
} catch (error) {
64+
// если ошибка сети и есть еще попытки - повторяем
65+
if (error.message === 'Failed to fetch' && retryCount < maxRetries) {
66+
console.log(
67+
`Сетевая ошибка, повторяем попытку ${retryCount + 1}/${maxRetries}`,
68+
)
69+
await new Promise((resolve) => setTimeout(resolve, 1000))
70+
return addComment({ name, text, forceError }, retryCount + 1)
71+
}
72+
73+
console.error('Ошибка при добавлении комментария:', error)
74+
throw error
75+
}
76+
}

‎modules/data.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,2 @@
1-
export let comments = [];
2-
export let replyingTo = null;
1+
export let comments = []
2+
export let replyingTo = null

0 commit comments

Comments
 (0)