From cc72bb0ea7cd8af1844a5ecfd2a6255022fce55c Mon Sep 17 00:00:00 2001 From: PavelUd Date: Thu, 9 Nov 2023 01:29:45 +0500 Subject: [PATCH 1/3] =?UTF-8?q?=D1=81=D0=BE=D0=BC=D0=BD=D0=B8=D1=82=D0=B5?= =?UTF-8?q?=D0=BB=D1=8C=D0=BD=D1=8B=D0=B9=20=D0=BF=D0=BE=D0=BF=20=D1=8B?= =?UTF-8?q?=D1=82?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.html | 2 +- js/main.js | 3 +-- js/thumbnails-renderer.js | 22 ++++++++++++++++++++++ 3 files changed, 24 insertions(+), 3 deletions(-) create mode 100644 js/thumbnails-renderer.js diff --git a/index.html b/index.html index 3d476a4..fff46f1 100644 --- a/index.html +++ b/index.html @@ -129,7 +129,6 @@

Изображение успешно загруже + diff --git a/js/main.js b/js/main.js index b01ed05..139597f 100644 --- a/js/main.js +++ b/js/main.js @@ -1,3 +1,2 @@ -import {getPhotoDescriptions} from './data.js'; -getPhotoDescriptions(); + diff --git a/js/thumbnails-renderer.js b/js/thumbnails-renderer.js new file mode 100644 index 0000000..d6b734a --- /dev/null +++ b/js/thumbnails-renderer.js @@ -0,0 +1,22 @@ +import {getPhotoDescriptions} from './data.js'; + +const NULL_INDEX = 0; +const templatePicture = document.querySelector('#picture').content; +const pictures = document.querySelector('.pictures'); + +const getPicture = (photo) =>{ + const picture = templatePicture.cloneNode(true); + const img = picture.querySelector('.picture__img'); + img.src = photo.url; + img.alt = photo.description; + picture.querySelector('.picture__likes').textContent = photo.likes; + picture.querySelector('.picture__comments').textContent = photo.comments.length; + return picture; +}; + +const photos = getPhotoDescriptions(); +photos.forEach((photo, index) => { + if(index > NULL_INDEX){ + pictures.appendChild(getPicture(photo)); + } +}); From 7c4f7fffad957db87e751eba98d2e5405426a8c0 Mon Sep 17 00:00:00 2001 From: PavelUd Date: Mon, 13 Nov 2023 19:46:35 +0500 Subject: [PATCH 2/3] =?UTF-8?q?=D0=BF=D0=BE=D0=BF=D1=80=D0=B0=D0=B2=D0=BB?= =?UTF-8?q?=D0=B5=D0=BD=D0=BD=D1=8B=D0=B9=20=D0=BF=D0=BE=D0=BF=20=D1=8B?= =?UTF-8?q?=D1=82?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- js/data.js | 2 +- js/main.js | 4 ++++ js/thumbnails-renderer.js | 16 ++++++++++------ 3 files changed, 15 insertions(+), 7 deletions(-) diff --git a/js/data.js b/js/data.js index 04a1f89..4323d73 100644 --- a/js/data.js +++ b/js/data.js @@ -5,7 +5,7 @@ const MESSAGES = ['', 'Всё отлично!В целом всё неплохо 'Я поскользнулся на банановой кожуре и уронил фотоаппарат на кота и у меня получилась фотография лучше.', 'Лица у людей на фотке перекошены, как будто их избивают. Как можно было поймать такой неудачный момент?!']; const NAMES= ['Aboba', 'MegaGrib', 'Nagibator3000', 'Artem', 'Ghg', 'top_php_progger']; -const PHOTOS_COUNT = 25; +const PHOTOS_COUNT = 26; const MAX_COMMENTS_COUNT = 30; const LikesCount = { MIN: 15, diff --git a/js/main.js b/js/main.js index 139597f..629418f 100644 --- a/js/main.js +++ b/js/main.js @@ -1,2 +1,6 @@ +import {getPhotoDescriptions} from './data.js'; +import {thumbnailsRender} from './thumbnails-renderer.js'; +const photos = getPhotoDescriptions(); +thumbnailsRender(photos); diff --git a/js/thumbnails-renderer.js b/js/thumbnails-renderer.js index d6b734a..58a90a6 100644 --- a/js/thumbnails-renderer.js +++ b/js/thumbnails-renderer.js @@ -1,4 +1,4 @@ -import {getPhotoDescriptions} from './data.js'; +let photos = null; const NULL_INDEX = 0; const templatePicture = document.querySelector('#picture').content; @@ -14,9 +14,13 @@ const getPicture = (photo) =>{ return picture; }; -const photos = getPhotoDescriptions(); -photos.forEach((photo, index) => { - if(index > NULL_INDEX){ - pictures.appendChild(getPicture(photo)); +export const thumbnailsRender = (data) =>{ + photos = data.slice(); + if(photos){ + photos.forEach((photo, index) => { + if(index > NULL_INDEX){ + pictures.appendChild(getPicture(photo)); + } + }); } -}); +}; From c9ee42f1d99bc23b5753708f562caa866a5f84b2 Mon Sep 17 00:00:00 2001 From: PavelUd Date: Mon, 13 Nov 2023 19:58:10 +0500 Subject: [PATCH 3/3] sos --- js/data.js | 5 ++--- js/main.js | 4 ++-- 2 files changed, 4 insertions(+), 5 deletions(-) diff --git a/js/data.js b/js/data.js index 4323d73..b7a0b70 100644 --- a/js/data.js +++ b/js/data.js @@ -5,7 +5,6 @@ const MESSAGES = ['', 'Всё отлично!В целом всё неплохо 'Я поскользнулся на банановой кожуре и уронил фотоаппарат на кота и у меня получилась фотография лучше.', 'Лица у людей на фотке перекошены, как будто их избивают. Как можно было поймать такой неудачный момент?!']; const NAMES= ['Aboba', 'MegaGrib', 'Nagibator3000', 'Artem', 'Ghg', 'top_php_progger']; -const PHOTOS_COUNT = 26; const MAX_COMMENTS_COUNT = 30; const LikesCount = { MIN: 15, @@ -23,8 +22,8 @@ const getComments = (quantity, id) => new Array(quantity).fill('').map((_, messa }; }); -export const getPhotoDescriptions = () => - new Array(PHOTOS_COUNT).fill('').map((_, id) => ({ +export const getPhotoDescriptions = (photosCount) => + new Array(photosCount).fill('').map((_, id) => ({ id: id, url :`photos/${id}.jpg`, description : 'Мое придуманное описание', diff --git a/js/main.js b/js/main.js index 629418f..b5bab24 100644 --- a/js/main.js +++ b/js/main.js @@ -1,6 +1,6 @@ import {getPhotoDescriptions} from './data.js'; import {thumbnailsRender} from './thumbnails-renderer.js'; - -const photos = getPhotoDescriptions(); +const PHOTOS_COUNT = 26; +const photos = getPhotoDescriptions(PHOTOS_COUNT); thumbnailsRender(photos);