From 244a7d4ee6a591415fc2a890a325ffe90eda789e Mon Sep 17 00:00:00 2001 From: Yarnara Date: Thu, 17 Oct 2024 03:36:49 +0700 Subject: [PATCH] =?UTF-8?q?feat:=20=D1=80=D0=B0=D0=B7=D0=B1=D0=B8=D0=B2?= =?UTF-8?q?=D0=B0=D0=B5=D1=82=20=D0=BA=D0=BE=D0=B4=20=D0=BD=D0=B0=20=D0=BC?= =?UTF-8?q?=D0=BE=D0=B4=D1=83=D0=BB=D0=B8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.html | 63 ++++++++++++++++--------- js/content-generator.js | 51 ++++++++++++++++++++ js/data.js | 53 +++++++++++++++++++++ js/main.js | 100 +--------------------------------------- js/util.js | 5 ++ package.json | 1 + 6 files changed, 151 insertions(+), 122 deletions(-) create mode 100644 js/content-generator.js create mode 100644 js/data.js create mode 100644 js/util.js diff --git a/index.html b/index.html index f26f14e..40b3ad1 100644 --- a/index.html +++ b/index.html @@ -1,5 +1,6 @@ + @@ -16,7 +17,8 @@
- +
@@ -46,7 +48,8 @@
- - - + + + + diff --git a/js/content-generator.js b/js/content-generator.js new file mode 100644 index 0000000..b2cde0d --- /dev/null +++ b/js/content-generator.js @@ -0,0 +1,51 @@ +import { descriptionsPhotos, usernames, messages } from './data.js'; +import { getRandomInteger } from './util.js'; + +// Константы +const MIN_LIKES = 15; +const MAX_LIKES = 200; +const MIN_AVATAR_INDEX = 1; +const MAX_AVATAR_INDEX = 6; +const MAX_COMMENTS = 30; + +// Создает один комментарий +const createComment = (id) => ({ + id, + avatar: `img/avatar-${getRandomInteger(MIN_AVATAR_INDEX, MAX_AVATAR_INDEX)}.svg`, + message: messages[getRandomInteger(0, messages.length - 1)], + name: usernames[getRandomInteger(0, usernames.length - 1)] +}); + +// Создает массив комментариев +const createComments = (count, startId) => { + const comments = []; + for (let i = 0; i < count; i++) { + comments.push(createComment(startId + i)); + } + return comments; +}; + +// Создает одну фотографию +const createPhoto = (id, nextCommentId) => ({ + id, + url: `photos/${id}.jpg`, + description: descriptionsPhotos[id - 1], + likes: getRandomInteger(MIN_LIKES, MAX_LIKES), + comments: createComments(getRandomInteger(0, MAX_COMMENTS), nextCommentId) +}); + +// Создает массив фотографий +const createPhotos = (count) => { + const photos = []; + let nextCommentId = 1; + + for (let i = 1; i <= count; i++) { + const photo = createPhoto(i, nextCommentId); + nextCommentId += photo.comments.length; + photos.push(photo); + } + + return photos; +}; + +export {createPhotos }; diff --git a/js/data.js b/js/data.js new file mode 100644 index 0000000..da12aaf --- /dev/null +++ b/js/data.js @@ -0,0 +1,53 @@ + +// Временные данные +const descriptionsPhotos = [ + 'Нет людей — нет проблем!', + 'На пляж — это туда.', + 'Лазурное море, волшебное море, прекрасное море, хочу тебя понять...', + 'Согласия на эту фотографию я не получал', + 'Счастливы, потому что не знают, какая участь их ждет.', + 'Эта машина такая черная, что даже солнцу стыдно светить на неё.', + 'Типичный завтрак в отеле 5 звезд.', + 'В этом напитке нет ничего, кроме надежд, разбитых в хлам!', + 'Я пыталась его поймать, но он оказался быстрее.', + 'Это мы у пляжников спёрли.', + 'Поиграла с эстетикой. Проиграла', + 'Продам гараж.', + 'Рыба с огурцами: еда для тех, кто ненавидит себя и все вокруг!', + 'Фото для истинных ценителей неуместного кулинарного юмора.', + 'Вот гири к ним привяжу, соседи порадуются.', + 'Здесь мы видим небесный лайнер на фоне… ничего!', + 'Вам, наверное, интересно зачем я вас здесь собрал?', + 'Что древнее: эта тачка или эта стена?', + 'Иду к холодильнику в три часа ночи.', + 'Вы когда-нибудь видели, как природа отыгралась на пальмах? Теперь видели.', + 'Эта еда настолько невзрачна, что даже фотосессия не спасла!', + 'Детям до 18 лет запрещено смотреть в левый угол фотографии.', + 'Этот краб знает: лучше быть смешным, чем съеденным!', + 'Забудь о музыке — послушай, как все вокруг шумят!', + 'В последний раз видел такое на "Нашествии 2002"' +]; + +const usernames = [ + 'Шерлок Холмс', + 'Эркюль Пуаро', + 'Джеймс Бонд', + 'Лисбет Саландер', + 'Нэнси Дрю', + 'Квентин Тарантино', + 'Дик Трейси', + 'Инспектор Гаджет', + 'Кристофер Нолан', + 'Хантер С. Томпсон' +]; + +const messages = [ + 'Всё отлично!', + 'В целом всё неплохо. Но не всё.', + 'Когда вы делаете фотографию, хорошо бы убирать палец из кадра. В конце концов это просто непрофессионально.', + 'Моя бабушка случайно чихнула с фотоаппаратом в руках и у неё получилась фотография лучше.', + 'Я поскользнулся на банановой кожуре и уронил фотоаппарат на кота и у меня получилась фотография лучше.', + 'Лица у людей на фотке перекошены, как будто их избивают. Как можно было поймать такой неудачный момент?' +]; + +export { descriptionsPhotos, usernames, messages }; diff --git a/js/main.js b/js/main.js index ec0037d..1ef309f 100644 --- a/js/main.js +++ b/js/main.js @@ -1,105 +1,7 @@ -// Временные данные -const descriptionsPhotos = [ - 'Нет людей — нет проблем!', - 'На пляж — это туда.', - 'Лазурное море, волшебное море, прекрасное море, хочу тебя понять...', - 'Согласия на эту фотографию я не получал', - 'Счастливы, потому что не знают, какая участь их ждет.', - 'Эта машина такая черная, что даже солнцу стыдно светить на неё.', - 'Типичный завтрак в отеле 5 звезд.', - 'В этом напитке нет ничего, кроме надежд, разбитых в хлам!', - 'Я пыталась его поймать, но он оказался быстрее.', - 'Это мы у пляжников спёрли.', - 'Поиграла с эстетикой. Проиграла', - 'Продам гараж.', - 'Рыба с огурцами: еда для тех, кто ненавидит себя и все вокруг!', - 'Фото для истинных ценителей неуместного кулинарного юмора.', - 'Вот гири к ним привяжу, соседи порадуются.', - 'Здесь мы видим небесный лайнер на фоне… ничего!', - 'Вам, наверное, интересно зачем я вас здесь собрал?', - 'Что древнее: эта тачка или эта стена?', - 'Иду к холодильнику в три часа ночи.', - 'Вы когда-нибудь видели, как природа отыгралась на пальмах? Теперь видели.', - 'Эта еда настолько невзрачна, что даже фотосессия не спасла!', - 'Детям до 18 лет запрещено смотреть в левый угол фотографии.', - 'Этот краб знает: лучше быть смешным, чем съеденным!', - 'Забудь о музыке — послушай, как все вокруг шумят!', - 'В последний раз видел такое на "Нашествии 2002"' -]; +import { createPhotos } from './content-generator.js'; -const usernames = [ - 'Шерлок Холмс', - 'Эркюль Пуаро', - 'Джеймс Бонд', - 'Лисбет Саландер', - 'Нэнси Дрю', - 'Квентин Тарантино', - 'Дик Трейси', - 'Инспектор Гаджет', - 'Кристофер Нолан', - 'Хантер С. Томпсон' -]; - -const messages = [ - 'Всё отлично!', - 'В целом всё неплохо. Но не всё.', - 'Когда вы делаете фотографию, хорошо бы убирать палец из кадра. В конце концов это просто непрофессионально.', - 'Моя бабушка случайно чихнула с фотоаппаратом в руках и у неё получилась фотография лучше.', - 'Я поскользнулся на банановой кожуре и уронил фотоаппарат на кота и у меня получилась фотография лучше.', - 'Лица у людей на фотке перекошены, как будто их избивают. Как можно было поймать такой неудачный момент?' -]; - -// Константы -const MIN_LIKES = 15; -const MAX_LIKES = 200; -const MIN_AVATAR_INDEX = 1; -const MAX_AVATAR_INDEX = 6; -const MAX_COMMENTS = 30; const PHOTO_COUNT = 25; -// Получает целое число в заданном диапазоне -const getRandomInteger = (min, max) => Math.floor(Math.random() * (max - min + 1)) + min; - -// Создает один комментарий -const createComment = (id) => ({ - id, - avatar: `img/avatar-${getRandomInteger(MIN_AVATAR_INDEX, MAX_AVATAR_INDEX)}.svg`, - message: messages[getRandomInteger(0, messages.length - 1)], - name: usernames[getRandomInteger(0, usernames.length - 1)] -}); - -// Создает массив комментариев -const createComments = (count, startId) => { - const comments = []; - for (let i = 0; i < count; i++) { - comments.push(createComment(startId + i)); - } - return comments; -}; - -// Создает одну фотографию -const createPhoto = (id, nextCommentId) => ({ - id, - url: `photos/${id}.jpg`, - description: descriptionsPhotos[id - 1], - likes: getRandomInteger(MIN_LIKES, MAX_LIKES), - comments: createComments(getRandomInteger(0, MAX_COMMENTS), nextCommentId) -}); - -// Создает массив фотографий -const createPhotos = (count) => { - const photos = []; - let nextCommentId = 1; - - for (let i = 1; i <= count; i++) { - const photo = createPhoto(i, nextCommentId); - nextCommentId += photo.comments.length; - photos.push(photo); - } - - return photos; -}; - // Генерирует массив объектов с данными фотографий const generatedPhotos = createPhotos(PHOTO_COUNT); diff --git a/js/util.js b/js/util.js new file mode 100644 index 0000000..6007b12 --- /dev/null +++ b/js/util.js @@ -0,0 +1,5 @@ +// Получает целое число в заданном диапазоне +const getRandomInteger = (min, max) => Math.floor(Math.random() * (max - min + 1)) + min; + + +export { getRandomInteger }; diff --git a/package.json b/package.json index 5851069..031528a 100644 --- a/package.json +++ b/package.json @@ -2,6 +2,7 @@ "name": "kekstagram", "version": "31.0.0", "private": true, + "type": "module", "description": "Личный проект «Кекстаграм» от HTML Academy", "repository": { "type": "git",