update formatting

Irina-anat · Jan 15, 2024 · 75599ff · 75599ff
1 parent 7d9a7a9
commit 75599ff
Show file tree

Hide file tree

Showing 3 changed files with 36 additions and 36 deletions.
diff --git a/src/index.js b/src/index.js
@@ -1,11 +1,11 @@
-import './css/styles.css';
+import { getImages } from "./js/getImages";
+import { createMarcup } from "./js/createMarcup";
 import { Notify } from 'notiflix/build/notiflix-notify-aio';
 import SimpleLightbox from "simplelightbox";
 import "simplelightbox/dist/simple-lightbox.min.css";
-import { getImages } from "./js/getImages";
-import { createMarcup } from "./js/createMarcup";
+import './css/styles.css';
 
-const form = document.querySelector('.search-form');
+const form = document.querySelector(`.search-form`);
 const gallery = document.querySelector(`.gallery`);
 const guard = document.querySelector(`.js-guard`);
 
@@ -29,36 +29,36 @@ const observer = new IntersectionObserver(onLoadMore, options);
 form.addEventListener(`submit`, onSearch);
 
 async function onSearch(evn) {
-  evn.preventDefault()
+  evn.preventDefault();
   searchQuery = evn.target.elements.searchQuery.value.trim();
   if (!searchQuery) {
-    clear()
-    Notify.failure("Please fill in the search field.")
-    observer.unobserve(guard)
-    return
+    clear();
+    Notify.failure("Please fill in the search field.");
+    observer.unobserve(guard);
+    return;
   };
 
   try {
-    resetCurretPage()
+    resetCurretPage();
     const data = await getImages(searchQuery, currentPage);
-    console.log(data.hits)
+   // console.log(data.hits)
     if (!data.hits.length) {
-      form.reset()
-      clear()
-      Notify.failure("Sorry, there are no images matching your search query. Please try again.")
+      form.reset();
+      clear();
+      Notify.failure("Sorry, there are no images matching your search query. Please try again.");
       return;
-    } 
-      form.reset()
-      clear()
-      resetSlider() 
-      gallery.insertAdjacentHTML('beforeend', createMarcup(data.hits))
-      observer.observe(guard)
-      Notify.success(`Hooray! We found ${data.totalHits} images.`)
-      lightbox.refresh();  
+    };
+    form.reset();
+    clear();
+    resetSlider(); 
+    gallery.insertAdjacentHTML('beforeend', createMarcup(data.hits));
+    observer.observe(guard);
+    Notify.success(`Hooray! We found ${data.totalHits} images.`);
+    lightbox.refresh(); 
   }
   catch (err) {
-    console.log('ERROR: ' + `error`)
-    clear()
+    console.log('ERROR: ' + `error`);
+    clear();
   } 
 }; 
 
@@ -79,13 +79,13 @@ async function onSearch(evn) {
              observer.unobserve(guard);
            }
            lightbox.refresh();
-         }
-       })     
+         };
+       });    
     }
      catch {
-       console.log('ERROR: ' + `error`)
+       console.log('ERROR: ' + `error`);
        clear();
-    }
+    };
 };
 
 function resetCurretPage() {

diff --git a/src/js/createMarcup.js b/src/js/createMarcup.js
@@ -1,5 +1,5 @@
 function createMarcup(arr) {
-  return arr.map(({ webformatURL, largeImageURL, tags, likes, views, comments, downloads }) => 
+  return arr.map(({ webformatURL, largeImageURL, tags, likes, views, comments, downloads }) =>
     `<div class="photo-card">
      <a href="${largeImageURL}">
   <img src="${webformatURL}" alt="${tags}" loading="lazy" class="foto"/>
@@ -18,7 +18,7 @@ function createMarcup(arr) {
     </p>
   </div>
 </div>`)
-    .join(``) 
-}
+    .join(``); 
+};
 
-export {createMarcup}
+export { createMarcup };
diff --git a/src/js/getImages.js b/src/js/getImages.js
@@ -2,18 +2,18 @@ import axios from 'axios';
 const BASE_URL = "https://pixabay.com/api/";
 const API_KEY = "35791203-a082b793cbab5a6f0440a6e52";
 
-async function getImages(searchQuery, page = 1) {
+async function getImages(searchQuery, page) {
   const params = new URLSearchParams({
     key: API_KEY,
     q: searchQuery,
     image_type: 'photo',
     orientation: 'horizontal',
     safesearch: true,
     per_page: 40,
-  })
+  });
   const images = await axios.get(`${BASE_URL}?${params}&page=${page}`);
-  console.log(images.data)
+  //console.log(images.data)
   return images.data;
 };
 
-export {getImages}
+export { getImages };