From 22882117cacc2fd48167cd98fea274a5a7f2ae3f Mon Sep 17 00:00:00 2001 From: MethodGirl Date: Sun, 10 May 2026 16:52:27 +0300 Subject: [PATCH 1/5] =?UTF-8?q?=D0=BD=D0=B0=D1=87=D0=B0=D0=BB=D0=BE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.html | 233 +++++++++++++++++++++++++++-------------------------- 1 file changed, 120 insertions(+), 113 deletions(-) diff --git a/index.html b/index.html index e660a61fa..3dedb3398 100644 --- a/index.html +++ b/index.html @@ -1,84 +1,75 @@ - - Проект "Комменты" - - - - - -
- -
- - -
- -
+ + + Проект "Комменты" + + + + + +
+
    +
    + + +
    +
    - - - - - + \ No newline at end of file From 2baa49c3c9fa1676b5bf1d64992162e7fbb59ced Mon Sep 17 00:00:00 2001 From: MethodGirl <94073698+MethodGirl@users.noreply.github.com> Date: Sun, 10 May 2026 22:05:41 +0300 Subject: [PATCH 2/5] =?UTF-8?q?=D0=BC=D0=B5=D0=BB=D0=BA=D0=B8=D0=B5=20?= =?UTF-8?q?=D0=BF=D1=80=D0=B0=D0=B2=D0=BA=D0=B8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.html | 82 ++++++++++++++++++++++++++++++++++++------------------ 1 file changed, 55 insertions(+), 27 deletions(-) diff --git a/index.html b/index.html index e660a61fa..ba1840893 100644 --- a/index.html +++ b/index.html @@ -43,42 +43,43 @@ data: new Date(2022, 1, 12, 12, 18), text: "Это будет первый комментарий на этой странице", likesCounter: 3, - isLiked: true + isLiked: true, }, { name: "Варвара Н.", data: new Date(13, 2, 22, 19, 22), text: "Мне нравится как оформлена эта страница! ❤", likesCounter: 75, - isLiked: true + isLiked: true, }, ]; - function like() { + function addLikeHandlers() { let likeButtons = document.querySelectorAll(".like-button"); let likesCounter = document.querySelectorAll(".likes-counter"); likeButtons.forEach((button) => { - button.addEventListener("click", () => { + button.addEventListener("click", (event) => { + event.stopPropagation(); let index = button.dataset.index; - if (comments[index].isLiked === true) { - comments[index].isLiked = false - comments[index].likesCounter--; - } else { - comments[index].isLiked = true - comments[index].likesCounter++; - } + if (comments[index].isLiked === true) { + comments[index].isLiked = false; + comments[index].likesCounter--; + } else { + comments[index].isLiked = true; + comments[index].likesCounter++; + } - renderComment(); + renderComments(); }); }); } - function renderComment() { - let commentElement = comments + function renderComments() { + let commentElements = comments .map((comment, index) => { - return `
  • + return `
  • ${comment.name}
    ${getFormattedDate(comment.data)}
    @@ -89,18 +90,19 @@
    • `; }) .join(""); - commentsBox.innerHTML = commentElement; - like(); + commentsBox.innerHTML = commentElements; + copyCommentToForm(); + addLikeHandlers(); } - renderComment(); + renderComments(); function getFormattedDate(date) { let day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate(); @@ -109,12 +111,22 @@ ? "0" + (date.getMonth() + 1) : date.getMonth() + 1; let year = date.getFullYear() % 100; - let hours = date.getHours() < 10 ? "0" + date.getHours() : date.getHours(); + let hours = + date.getHours() < 10 ? "0" + date.getHours() : date.getHours(); let minutes = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes(); return `${day}.${month}.${year} ${hours}:${minutes}`; } + function filterText(text) { + return text + .replaceAll("&", "&") + .replaceAll("<", "<") + .replaceAll(">", ">") + .replaceAll('"', """) + .replaceAll("'", "'"); + } + formButton.addEventListener("click", () => { let commentValue = formComment.value; let nameValue = formName.value; @@ -124,20 +136,36 @@ return; } - let commentElement = {}; + let comment = {}; - commentElement.name = nameValue; - commentElement.data = new Date(); - commentElement.text = commentValue; - commentElement.likesCounter = 0; + comment.name = filterText(nameValue); + comment.data = new Date(); + comment.text = filterText(commentValue); + comment.likesCounter = 0; - comments.push(commentElement); + comments.push(comment); - renderComment(); + renderComments(); formComment.value = ""; formName.value = ""; }); + function copyCommentToForm() { + let commentsEl = document.querySelectorAll(".comment"); + + for (let commentEl of commentsEl) { + commentEl.addEventListener("click", () => { + console.log(commentEl); + let index = commentEl.dataset.id; + + formComment.value = + "Ответ на комментарий: " + + `${filterText(comments[index].text)}` + + " Автор: " + + `${filterText(comments[index].name)}`; + }); + } + } From 3cf6777f4126875a71e566247f5f25dc22cec0a3 Mon Sep 17 00:00:00 2001 From: MethodGirl <94073698+MethodGirl@users.noreply.github.com> Date: Sun, 10 May 2026 23:13:54 +0300 Subject: [PATCH 3/5] Update index.html --- index.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/index.html b/index.html index 517c66b18..ae5e08d6a 100644 --- a/index.html +++ b/index.html @@ -121,7 +121,7 @@ comment.name = nameValue; comment.data = new Date(); - comment.text = commentValue; + comment.text = filterText(commentValue); comment.likesCounter = 0; comments.push(comment); @@ -149,7 +149,7 @@ console.log(commentEl) let index = commentEl.dataset.id; - formComment.value ="Ответ на комментарий: " + `${comments[index].text}` + " Автор: " + `${comments[index].name}` + formComment.value ="Ответ на комментарий: " + `filterText(${comments[index].text})` + " Автор: " + `filterText(${comments[index].name}0` }) } } From 33e17d2d5599c9e96cdb8c6eae3da8a641cda05f Mon Sep 17 00:00:00 2001 From: MethodGirl <94073698+MethodGirl@users.noreply.github.com> Date: Sun, 10 May 2026 23:14:41 +0300 Subject: [PATCH 4/5] Update index.html --- index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.html b/index.html index ae5e08d6a..aeddd16df 100644 --- a/index.html +++ b/index.html @@ -119,7 +119,7 @@ let comment = {}; - comment.name = nameValue; + comment.name = filterText(nameValue); comment.data = new Date(); comment.text = filterText(commentValue); comment.likesCounter = 0; From 32f8f063ccd8cf6fd28ea9a30a82fca468fb7aab Mon Sep 17 00:00:00 2001 From: MethodGirl <94073698+MethodGirl@users.noreply.github.com> Date: Mon, 11 May 2026 00:07:57 +0300 Subject: [PATCH 5/5] Update index.html --- index.html | 313 ++++++++++++++++++++++++++++------------------------- 1 file changed, 168 insertions(+), 145 deletions(-) diff --git a/index.html b/index.html index aeddd16df..ac1e595ec 100644 --- a/index.html +++ b/index.html @@ -1,159 +1,182 @@ - - - Проект "Комменты" - - - - - -
    -
      -
      - - -
      - + + Проект "Комменты" + + + + + +
      +
        +
        + + +
        + +
        -
        - - - + function addCopyCommentToFormHandlers() { + let commentsEl = document.querySelectorAll(".comment"); + + for (let commentEl of commentsEl) { + function copyCommentToForm() { + console.log(commentEl); + let index = commentEl.dataset.id; - \ No newline at end of file + formComment.value = + "Ответ на комментарий: " + + humanizeText(comments[index].text) + + " Автор: " + + humanizeText(comments[index].name); + } + + commentEl.addEventListener("click", copyCommentToForm); + } + } + +