From 40738ae3e77f5fd680ad08f11cfd0114f3276047 Mon Sep 17 00:00:00 2001 From: SIDRIK1 Date: Mon, 9 Mar 2026 23:57:27 +0400 Subject: [PATCH 1/4] 09.03.2026 --- index.html | 152 ++++++++++++++++++++++++++++++++--------------------- 1 file changed, 92 insertions(+), 60 deletions(-) diff --git a/index.html b/index.html index 6f14ae14aa..3ab8b09c04 100644 --- a/index.html +++ b/index.html @@ -1,71 +1,103 @@ - - Проект "Комменты" - - - - -
- +
+ + +
+
- +
+ + + - - + \ No newline at end of file From afde468efe8b28e1b7c6b9692e6d996ce8474668 Mon Sep 17 00:00:00 2001 From: SIDRIK1 Date: Sun, 15 Mar 2026 23:52:46 +0400 Subject: [PATCH 2/4] 15.03.2026 --- index.html | 37 ++++++++++++++++++++++++++++++++++++- 1 file changed, 36 insertions(+), 1 deletion(-) diff --git a/index.html b/index.html index 3ab8b09c04..0d8ca95d49 100644 --- a/index.html +++ b/index.html @@ -59,6 +59,12 @@ "use strict"; // Код писать здесь + const CommentListNach = document.querySelector('.comments') + const CommentList = CommentListNach.innerHTML + const LikesElements = document.querySelectorAll('.like-button') + + + document.querySelector('.add-form-button').addEventListener('click', () => { const commentsList = document.querySelector('.comments'); const nameInput = document.querySelector('.add-form-name').value; @@ -84,7 +90,7 @@
@@ -94,9 +100,38 @@ document.querySelector('.add-form-name').value = ''; document.querySelector('.add-form-text').value = ''; + + const LikesElements = document.querySelectorAll('.like-button') + const CounterElements = document.querySelectorAll('.likes-counter') + const test2End = document.querySelectorAll('.likes') + + const likeButtons = document.querySelectorAll('.like-button'); + + likeButtons.forEach(button => { + button.addEventListener('click', () => { + const likesContainer = button.closest('.likes'); + const counter = likesContainer.querySelector('.likes-counter'); + const currentLikes = parseInt(counter.textContent); + + + button.classList.toggle('-active-like'); + + + if (button.classList.contains('-active-like')) { + counter.textContent = currentLikes + 1; + } else { + counter.textContent = currentLikes - 1; + } + }); + }); }); + + + + + console.log("It works!"); From 3f425b1e7108ac7cf0c0ceec034f3f8dc4b3e5ec Mon Sep 17 00:00:00 2001 From: SIDRIK1 Date: Mon, 16 Mar 2026 23:15:27 +0400 Subject: [PATCH 3/4] 16.03.2026 --- index.html | 106 +++++++++++++++++++++++++++++------------------------ 1 file changed, 59 insertions(+), 47 deletions(-) diff --git a/index.html b/index.html index 0d8ca95d49..3091c57d8b 100644 --- a/index.html +++ b/index.html @@ -10,7 +10,7 @@
    -
  • +
@@ -59,11 +59,62 @@ "use strict"; // Код писать здесь - const CommentListNach = document.querySelector('.comments') - const CommentList = CommentListNach.innerHTML - const LikesElements = document.querySelectorAll('.like-button') + const spisokComments = document.querySelector('.comments'); + + let commentsStats = [ + { name: 'Глеб Фокин', date: '12.02.22 12:18', comment: 'Это будет первый комментарий на этой странице', likes: '3', Clicked: false }, + { name: 'Варвара Н.', date: '13.02.22 19:22', comment: 'Мне нравится как оформлена эта страница! ❤', likes: '75', Clicked: true } + ] + + const renderFunctionComments = () => { + const commentHTML = commentsStats.map((comment) => { + return `
  • +
    +
    ${comment.name}
    +
    ${comment.date}
    +
    +
    +
    + ${comment.comment} +
    +
    +
    + +
    +
    • ` + }).join('') + + spisokComments.innerHTML = commentHTML + + } + + renderFunctionComments() + + document.addEventListener('click', function (e) { + if (e.target.classList.contains('like-button')) { + + const button = e.target; + const commentElement = button.closest('.comment'); + const likesContainer = button.closest('.likes'); + const counter = likesContainer.querySelector('.likes-counter'); + + const index = Array.from(spisokComments.children).indexOf(commentElement); + + commentsStats[index].Clicked = !commentsStats[index].Clicked; + + const currentLikes = parseInt(counter.textContent) || 0; + commentsStats[index].likes = commentsStats[index].Clicked + ? (currentLikes + 1).toString() + : Math.max(0, currentLikes - 1).toString(); + + renderFunctionComments(); + } + }); document.querySelector('.add-form-button').addEventListener('click', () => { const commentsList = document.querySelector('.comments'); @@ -78,52 +129,13 @@ return; } - const commentHTML = ` -
  • -
    -
    ${nameInput}
    -
    ${dateStr}
    -
    -
    -
    ${textInput}
    -
    -
    - -
    -
    • - `; - - commentsList.insertAdjacentHTML('beforeend', commentHTML); + commentsStats.push({ name: nameInput, date: dateStr, comment: textInput, likes: randomLikes, Clicked: false }) document.querySelector('.add-form-name').value = ''; document.querySelector('.add-form-text').value = ''; - const LikesElements = document.querySelectorAll('.like-button') - const CounterElements = document.querySelectorAll('.likes-counter') - const test2End = document.querySelectorAll('.likes') - - const likeButtons = document.querySelectorAll('.like-button'); - - likeButtons.forEach(button => { - button.addEventListener('click', () => { - const likesContainer = button.closest('.likes'); - const counter = likesContainer.querySelector('.likes-counter'); - const currentLikes = parseInt(counter.textContent); - - - button.classList.toggle('-active-like'); - - - if (button.classList.contains('-active-like')) { - counter.textContent = currentLikes + 1; - } else { - counter.textContent = currentLikes - 1; - } - }); - }); + renderFunctionComments() + }); From 40b892c195ada5719aac4b2e30bf3822449315c9 Mon Sep 17 00:00:00 2001 From: SIDRIK1 Date: Tue, 17 Mar 2026 01:07:10 +0400 Subject: [PATCH 4/4] 17.03.2026 --- index.html | 28 +++++++++++++++++++++++++--- 1 file changed, 25 insertions(+), 3 deletions(-) diff --git a/index.html b/index.html index 3091c57d8b..7eff44baa5 100644 --- a/index.html +++ b/index.html @@ -65,6 +65,17 @@ { name: 'Глеб Фокин', date: '12.02.22 12:18', comment: 'Это будет первый комментарий на этой странице', likes: '3', Clicked: false }, { name: 'Варвара Н.', date: '13.02.22 19:22', comment: 'Мне нравится как оформлена эта страница! ❤', likes: '75', Clicked: true } ] + + const escapeHtml = (text) => { + const map = { + '&': '&', + '<': '<', + '>': '>', + '"': '"', + "'": ''' + }; + return text.replace(/[&<>"']/g, (m) => map[m]); + }; const renderFunctionComments = () => { const commentHTML = commentsStats.map((comment) => { @@ -88,9 +99,6 @@ }).join('') spisokComments.innerHTML = commentHTML - - - } renderFunctionComments() @@ -114,6 +122,19 @@ renderFunctionComments(); } + else if (e.target.closest('.comment') && + !e.target.closest('.like-button') && + !e.target.closest('.likes')) { + + const commentElement = e.target.closest('.comment'); + const index = Array.from(spisokComments.children).indexOf(commentElement); + const comment = commentsStats[index]; + + const replyPrefix = `Re: ${comment.name}\nОтвет на: "${comment.comment}" \n`; + + document.querySelector('.add-form-text').value = replyPrefix; + document.querySelector('.add-form-text').focus(); + } }); document.querySelector('.add-form-button').addEventListener('click', () => { @@ -144,6 +165,7 @@ + console.log("It works!");