Skip to content

Commit 3ccba6b

Browse files
keksobotkeksobot
authored
Merge pull request #19 from YouAreNotReady/master
2 parents 9bbcf62 + eef7d31 commit 3ccba6b

File tree

4 files changed

+82
-78
lines changed

4 files changed

+82
-78
lines changed

‎js/api.js‎

Lines changed: 4 additions & 75 deletions
Original file line numberDiff line numberDiff line change
@@ -1,81 +1,12 @@
1-
import { uploadFormCloseHandler, documentKeydownHandler } from './image-upload.js';
1+
import { showError, uploadSuccessful, uploadError } from './show-status-popup.js';
22
import { unblockSubmitButton } from './image-upload.js';
3-
import { isEscapeKey } from './util.js';
43

5-
const ERROR_TIMEOUT_MS = 5000;
64
const BASE_URL = 'https://31.javascript.htmlacademy.pro/kekstagram';
75
const Route = {
86
GET_DATA: '/data',
97
SEND_DATA: '/',
108
};
119

12-
const dataErrorTemplateNode = document.querySelector('#data-error').content.querySelector('.data-error');
13-
const successTemplateNode = document.querySelector('#success').content.querySelector('.success');
14-
const errorTemplateNode = document.querySelector('#error').content.querySelector('.error');
15-
const errorMessage = errorTemplateNode.cloneNode(true);
16-
const successMessage = successTemplateNode.cloneNode(true);
17-
18-
const showError = () => {
19-
const errorMessageNode = dataErrorTemplateNode.cloneNode(true);
20-
document.body.appendChild(errorMessageNode);
21-
setTimeout(() => {
22-
errorMessageNode.remove();
23-
}, ERROR_TIMEOUT_MS);
24-
};
25-
26-
27-
const onSuccessMessageKeydown = (evt) => {
28-
if (isEscapeKey(evt)) {
29-
evt.preventDefault();
30-
successMessageCloseHandler();
31-
successMessage.removeEventListener('click', successMessageCloseHandler);
32-
}
33-
};
34-
35-
function successMessageCloseHandler() {
36-
successMessage.remove();
37-
document.removeEventListener('keydown', onSuccessMessageKeydown);
38-
}
39-
40-
const uploadSuccessful = () => {
41-
document.body.appendChild(successMessage);
42-
document.addEventListener('keydown', onSuccessMessageKeydown);
43-
44-
successMessage.addEventListener('click', (evt) => {
45-
if(!evt.target.closest('div') || evt.target.closest('button')) {
46-
successMessageCloseHandler();
47-
}
48-
});
49-
50-
uploadFormCloseHandler();
51-
};
52-
53-
const errorMessageCloseHandler = () => {
54-
errorMessage.remove();
55-
document.removeEventListener('keydown', errorMessageCloseHandler);
56-
document.addEventListener('keydown', documentKeydownHandler);
57-
};
58-
59-
const errorMessageKeydown = (evt) => {
60-
if (isEscapeKey(evt)) {
61-
evt.preventDefault();
62-
errorMessageCloseHandler();
63-
errorMessage.removeEventListener('click', errorMessageCloseHandler);
64-
}
65-
};
66-
67-
const uploadError = () => {
68-
document.body.appendChild(errorMessage);
69-
document.removeEventListener('keydown', documentKeydownHandler);
70-
document.addEventListener('keydown', errorMessageKeydown);
71-
72-
errorMessage.addEventListener('click', (evt) => {
73-
if(!evt.target.closest('div') || evt.target.closest('button')) {
74-
errorMessageCloseHandler();
75-
}
76-
});
77-
};
78-
7910
const loadData = () =>
8011
fetch(`${BASE_URL}${Route.GET_DATA}`)
8112
.then((response) => {
@@ -84,11 +15,9 @@ const loadData = () =>
8415
}
8516
return response.json();
8617
})
87-
.catch(() => {
88-
showError();
89-
});
18+
.catch(showError);
9019

91-
const uploadData = (body) => {
20+
const uploadData = async (body) => {
9221
fetch(
9322
`${BASE_URL}${Route.SEND_DATA}`,
9423
{
@@ -104,4 +33,4 @@ const uploadData = (body) => {
10433
.finally(unblockSubmitButton);
10534
};
10635

107-
export { loadData, uploadData, showError };
36+
export { loadData, uploadData };

‎js/image-upload.js‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import { isEscapeKey } from './util.js';
2-
import { uploadData, showError } from './api.js';
2+
import { uploadData } from './api.js';
3+
import { showError } from './show-status-popup.js';
34
import { imagePreview, scaleValueField } from './image-scaling.js';
45
import { sliderNodeWrapper, effectPreviewElements } from './image-effect.js';
56
import { validateAllHashtags, validateHashtagError } from './hashtag-validation.js';
@@ -113,4 +114,4 @@ const initForm = () => {
113114
pristine.addValidator(imageUploadForm.querySelector('.text__hashtags'), validateAllHashtags, validateHashtagError);
114115
pristine.addValidator(imageUploadForm.querySelector('.text__description'), validateComment, validationCommentError);
115116

116-
export { initForm, uploadFormCloseHandler, unblockSubmitButton, documentKeydownHandler};
117+
export { initForm, uploadFormCloseHandler, documentKeydownHandler, unblockSubmitButton};

‎js/main.js‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import { renderImages, setImagesContainerClickHandler } from './images-preview-loader.js';
2-
import { loadData, showError } from './api.js';
2+
import { loadData } from './api.js';
3+
import { showError } from './show-status-popup.js';
34
import { initForm } from './image-upload.js';
45
import { showFilter, setFilterClickHandler } from './image-filtration.js';
56

‎js/show-status-popup.js‎

Lines changed: 73 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
import { uploadFormCloseHandler, documentKeydownHandler } from './image-upload.js';
2+
import { isEscapeKey } from './util.js';
3+
4+
const ERROR_TIMEOUT_MS = 5000;
5+
6+
const dataErrorTemplateNode = document.querySelector('#data-error').content.querySelector('.data-error');
7+
const errorTemplateNode = document.querySelector('#error').content.querySelector('.error');
8+
const successTemplateNode = document.querySelector('#success').content.querySelector('.success');
9+
const dataErrorMessageNode = dataErrorTemplateNode.cloneNode(true);
10+
const errorMessage = errorTemplateNode.cloneNode(true);
11+
const successMessage = successTemplateNode.cloneNode(true);
12+
13+
const showError = () => {
14+
document.body.appendChild(dataErrorMessageNode);
15+
setTimeout(() => {
16+
dataErrorMessageNode.remove();
17+
}, ERROR_TIMEOUT_MS);
18+
};
19+
20+
21+
const onSuccessMessageKeydown = (evt) => {
22+
if (isEscapeKey(evt)) {
23+
evt.preventDefault();
24+
successMessageCloseHandler();
25+
successMessage.removeEventListener('click', successMessageCloseHandler);
26+
}
27+
};
28+
29+
function successMessageCloseHandler() {
30+
successMessage.remove();
31+
document.removeEventListener('keydown', onSuccessMessageKeydown);
32+
}
33+
34+
const uploadSuccessful = () => {
35+
document.body.appendChild(successMessage);
36+
document.addEventListener('keydown', onSuccessMessageKeydown);
37+
38+
successMessage.addEventListener('click', (evt) => {
39+
if(!evt.target.closest('div') || evt.target.closest('button')) {
40+
successMessageCloseHandler();
41+
}
42+
});
43+
44+
uploadFormCloseHandler();
45+
};
46+
47+
const errorMessageCloseHandler = () => {
48+
errorMessage.remove();
49+
document.removeEventListener('keydown', errorMessageCloseHandler);
50+
document.addEventListener('keydown', documentKeydownHandler);
51+
};
52+
53+
const errorMessageKeydown = (evt) => {
54+
if (isEscapeKey(evt)) {
55+
evt.preventDefault();
56+
errorMessageCloseHandler();
57+
errorMessage.removeEventListener('click', errorMessageCloseHandler);
58+
}
59+
};
60+
61+
const uploadError = () => {
62+
document.body.appendChild(errorMessage);
63+
document.removeEventListener('keydown', documentKeydownHandler);
64+
document.addEventListener('keydown', errorMessageKeydown);
65+
66+
errorMessage.addEventListener('click', (evt) => {
67+
if(!evt.target.closest('div') || evt.target.closest('button')) {
68+
errorMessageCloseHandler();
69+
}
70+
});
71+
};
72+
73+
export { showError, uploadSuccessful, uploadError};

0 commit comments

Comments
 (0)