diff --git a/modules/eventsBtnAddComment.js b/modules/eventsBtnAddComment.js index 38987c3..ac6a27b 100644 --- a/modules/eventsBtnAddComment.js +++ b/modules/eventsBtnAddComment.js @@ -11,53 +11,79 @@ function removeClassError(input) { input.classList.remove('input-error'); } -export function addClickBtnAddComment(API) { - btnWrite.addEventListener('click', () => { - if (inputName.value === '' || inputText.value === '') { - if (inputName.value === '') { - inputName.classList.add('input-error'); - - setTimeout(() => removeClassError(inputName), 2000); - } - if (inputText.value === '') { - inputText.classList.add('input-error'); +function clickAddComment(API) { + if (inputName.value === '' || inputText.value === '') { + if (inputName.value === '') { + inputName.classList.add('input-error'); - setTimeout(() => removeClassError(inputText), 2000); - } - - return; + setTimeout(() => removeClassError(inputName), 2000); } + if (inputText.value === '') { + inputText.classList.add('input-error'); - if (inputName.value.length < 3 || inputText.value.length < 3) { - inputName.value.length < 3 - ? alert('Имя не должно быть менее 3 символов') - : alert('Комментарий не должен быть менее 3 символов'); - return; + setTimeout(() => removeClassError(inputText), 2000); } - const newComment = { - text: replaceSymbol(inputText.value), - name: replaceSymbol(inputName.value), - }; + return; + } - formAddComment.style.display = 'none'; + const newComment = { + text: replaceSymbol(inputText.value), + name: replaceSymbol(inputName.value), + forceError: true, + }; - const loaderText = document.createElement('p'); - loaderText.textContent = 'Комментарий добавляется'; - container.appendChild(loaderText); + formAddComment.style.display = 'none'; - fetch(API, { - method: 'POST', - body: JSON.stringify(newComment), - }) - .then(() => { - return fetchGetComments(API); - }) - .then(() => { + const loaderText = document.createElement('p'); + loaderText.textContent = 'Комментарий добавляется'; + container.appendChild(loaderText); + + let isCrashServer = false; + + fetch(API, { + method: 'POST', + body: JSON.stringify(newComment), + }) + .then((responce) => { + if (responce.status === 201) { inputName.value = ''; inputText.value = ''; + + return fetchGetComments(API); + } else { + if (responce.status === 400) { + throw new Error('400'); + } + + if (responce.status === 500) { + isCrashServer = true; + clickAddComment(API); + } + } + }) + .catch((error) => { + switch (error.message) { + case '400': + alert('Имя и комментарий должны быть не короче 3 символов'); + break; + case '500': + alert('Сервер сломался, попробуй позже'); + break; + default: + alert('Кажется, у вас сломался интернет, попробуйте позже'); + break; + } + }) + .finally(() => { + container.removeChild(loaderText); + + if (!isCrashServer) { formAddComment.style.display = 'flex'; - container.removeChild(loaderText); - }); - }); + } + }); +} + +export function addClickBtnAddComment(API) { + btnWrite.addEventListener('click', () => clickAddComment(API)); }