Merge pull request #13 from brazilets/module12-task2

Фото на память

js/uploadForm.js

@@ -210,5 +210,56 @@ imgUploadForm.addEventListener('submit', (evt) => {
     });
 });
 
+inputFile.addEventListener('change', function () {
+  const file = this.files[0];
+  const reader = new FileReader();
+
+  reader.onloadend = function () {
+    imgPreview.src = reader.result;
+  };
+
+  if (file) {
+    reader.readAsDataURL(file);
+  } else {
+    imgPreview.src = '';
+  }
+});
+
+
+const errorMessageElement = document.createElement('div');
+errorMessageElement.classList.add('error-message');
+errorMessageElement.textContent = 'Произошла ошибка при загрузке фотографии. Пожалуйста, попробуйте еще раз.';
+
+errorMessageElement.style.position = 'fixed';
+errorMessageElement.style.top = '0';
+errorMessageElement.style.left = '0';
+errorMessageElement.style.width = '100%';
+errorMessageElement.style.padding = '10px';
+errorMessageElement.style.backgroundColor = 'red';
+errorMessageElement.style.color = 'white';
+errorMessageElement.style.textAlign = 'center';
+errorMessageElement.style.zIndex = '1000';
+errorMessageElement.style.display = 'none';
+
+imgUploadForm.addEventListener('submit', (evt) => {
+  evt.preventDefault();
+
+  const formData = new FormData(imgUploadForm);
+
+  sendData(formData)
+    .then(() => {
+      errorMessageElement.style.display = 'none';
+    })
+
+    .catch(() => {
+      errorMessageElement.style.display = 'block';
+      setTimeout(() => {
+        errorMessageElement.style.display = 'none';
+      }, 3000);
+
+    });
+});
+
+document.body.prepend(errorMessageElement);
 
 export { imgPreview };