diff --git a/js/main.js b/js/main.js index 4ca3a9c..911129c 100644 --- a/js/main.js +++ b/js/main.js @@ -1,13 +1,12 @@ import './util.js'; import {createPhotoList} from './data.js'; import {renderThumbnails, pictures} from './render-thumbnails.js'; -import {openFullPicture} from './open-full-picture.js'; +import {initClickListener} from './open-full-picture.js'; + +const data = createPhotoList(); + +renderThumbnails(data); +initClickListener(data); -pictures.addEventListener('click', (evt) => { - const currentPicture = evt.target.closest('picture'); - if (currentPicture) { - openFullPicture(currentPicture.dataset.pictureId); - } -}); diff --git a/js/open-full-picture.js b/js/open-full-picture.js index 9201e0d..604de72 100644 --- a/js/open-full-picture.js +++ b/js/open-full-picture.js @@ -18,8 +18,8 @@ const onClickButtonClose = (evt) => { }; -const openFullPicture = (pictureId) => { - const currentPhoto = pictures.find((photo) => photo.id === Number(pictureId)); +const openFullPicture = (pictureId, data) => { + const currentPhoto = data.find((photo) => photo.id === Number(pictureId)); document.querySelector('body').classList.add('modal-open'); document.querySelector('.big-picture').classList.remove('hidden'); @@ -40,5 +40,15 @@ function closeFullPicture() { document.removeEventListener('keydown', onDocumentKeydown); } -export {openFullPicture, closeFullPicture}; +const initClickListener = (data) => { + pictures.addEventListener('click', (evt) => { + const currentPicture = evt.target.closest('.picture'); + + if (currentPicture) { + openFullPicture(currentPicture.dataset.pictureId, data); + } + }); +}; + +export {openFullPicture, closeFullPicture, initClickListener}; diff --git a/js/render-thumbnails.js b/js/render-thumbnails.js index 07921f8..d49e65b 100644 --- a/js/render-thumbnails.js +++ b/js/render-thumbnails.js @@ -16,7 +16,7 @@ const renderThumbnails = () => { usersElement.querySelector('.picture__img').src = photo.url; usersElement.querySelector('.picture__img').alt = photo.description; usersElement.querySelector('.picture__likes').textContent = photo.likes; - usersElement.querySelector('.picture__comments').textContent = photo.comments; + usersElement.querySelector('.picture__comments').textContent = photo.comments.length; usersThumbnailsFragment.appendChild(usersElement); });