Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Отрисуй меня полностью #8

Merged
merged 1 commit into from
Jul 15, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 5 additions & 4 deletions js/constant.js
Original file line number Diff line number Diff line change
@@ -1,13 +1,14 @@
const POSTS_COUNT = 25;
const MIN_POSTS_COUNT = 1;
const MAX_POSTS_COUNT = 25;
const AVATAR_MIN_COUNT = 1;
const AVATAR_MAX_COUNT = 25;
const AVATAR_MAX_COUNT = 6;
const LIKES_MIN_COUNT = 15;
const LIKES_MAX_COUNT = 200;
const COMMENT_MIN_COUNT = 0;
const COMMENT_MAX_COUNT = 30;
const COMMENT_MAX_ID = 500000;

const COMENT_NAMES = [
const COMMENT_NAMES = [
'Анна',
'Александр',
'Светлана',
Expand Down Expand Up @@ -51,4 +52,4 @@ const DESCRIPTIONS = [
'Этой фотографии описание не нужно'
];

export {POSTS_COUNT, AVATAR_MIN_COUNT, AVATAR_MAX_COUNT, LIKES_MIN_COUNT, LIKES_MAX_COUNT, COMMENT_MIN_COUNT, COMMENT_MAX_COUNT, COMMENT_MAX_ID, COMENT_NAMES, POSTS_COMMENTS, DESCRIPTIONS};
export {MAX_POSTS_COUNT, MIN_POSTS_COUNT, AVATAR_MIN_COUNT, AVATAR_MAX_COUNT, LIKES_MIN_COUNT, LIKES_MAX_COUNT, COMMENT_MIN_COUNT, COMMENT_MAX_COUNT, COMMENT_MAX_ID, COMMENT_NAMES, POSTS_COMMENTS, DESCRIPTIONS};
11 changes: 5 additions & 6 deletions js/data.js
Original file line number Diff line number Diff line change
@@ -1,24 +1,23 @@
import {
POSTS_COUNT, AVATAR_MIN_COUNT, AVATAR_MAX_COUNT, LIKES_MIN_COUNT, LIKES_MAX_COUNT, COMMENT_MIN_COUNT, COMMENT_MAX_COUNT, COMMENT_MAX_ID, COMENT_NAMES, POSTS_COMMENTS, DESCRIPTIONS
MAX_POSTS_COUNT, MIN_POSTS_COUNT, AVATAR_MIN_COUNT, AVATAR_MAX_COUNT, LIKES_MIN_COUNT, LIKES_MAX_COUNT, COMMENT_MIN_COUNT, COMMENT_MAX_COUNT, COMMENT_MAX_ID, COMMENT_NAMES, POSTS_COMMENTS, DESCRIPTIONS
} from './constant.js';

import {
getRandomInteger, getUniqueInteger, getRandomArrayElement
} from './utils.js';

const randomPostId = getUniqueInteger(1, POSTS_COUNT);
const randomPostUrl = getUniqueInteger(1, POSTS_COUNT);
const randomPostId = getUniqueInteger(MIN_POSTS_COUNT, MAX_POSTS_COUNT);
const randomPostUrl = getUniqueInteger(MIN_POSTS_COUNT, MAX_POSTS_COUNT);
const randomCommentID = getUniqueInteger(1, COMMENT_MAX_ID);

const createPost = () => {

const randomPostDescription = getRandomArrayElement(DESCRIPTIONS);

const createComment = () => ({
'id': randomCommentID,
'avatar': `img/avatar-${getRandomInteger(AVATAR_MIN_COUNT,AVATAR_MAX_COUNT)}.svg`,
'message': getRandomArrayElement(POSTS_COMMENTS),
'name': getRandomArrayElement(COMENT_NAMES),
'name': getRandomArrayElement(COMMENT_NAMES),
});

return {
Expand All @@ -30,6 +29,6 @@ const createPost = () => {
};
};

const randomPosts = Array.from({ length: POSTS_COUNT }, createPost);
const randomPosts = () => Array.from({ length: MAX_POSTS_COUNT }, createPost);

export {randomPosts};
3 changes: 2 additions & 1 deletion js/main.js
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
import {randomPosts} from './data.js';
import {generateThumbnails} from './thumbnail.js';
generateThumbnails(randomPosts());

console.log(randomPosts);
26 changes: 26 additions & 0 deletions js/thumbnail.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
const thumbNailTemplate = document.querySelector('#picture').content.querySelector('.picture');
const container = document.querySelector('.pictures');

const createThumbnail = (picture) => {
const thumbnail = thumbNailTemplate.cloneNode(true);

thumbnail.querySelector('.picture__img').src = picture.url;
thumbnail.querySelector('.picture__img').alt = picture.description;
thumbnail.querySelector('.picture__likes').textContent = picture.likes;
thumbnail.querySelector('.picture__comments').textContent = picture.comments.length;

return thumbnail;
};

const generateThumbnails = (pictures) => {
const fragment = document.createDocumentFragment();

pictures.forEach((picture) => {
const thumbnail = createThumbnail(picture);
fragment.append(thumbnail);
});

container.append(fragment);
};

export {generateThumbnails};
8 changes: 5 additions & 3 deletions js/utils.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,22 +6,24 @@ const getRandomInteger = (a, b) => {
return Math.floor(result);
};

function getUniqueInteger (min,max) {
const getUniqueInteger = (min,max) => {
const previousValues = [];

return function () {
let currentValue = getRandomInteger(min, max);

if (previousValues.length >= (max - min + 1)) {
return null;
}
let currentValue = getRandomInteger(min, max);

while (previousValues.includes(currentValue)) {
currentValue = getRandomInteger(min, max);
}
previousValues.push(currentValue);

return currentValue;
};
}
};

const getRandomArrayElement = (elements) => elements[getRandomInteger(0, elements.length - 1)];

Expand Down
Loading