diff --git a/index.html b/index.html index 6f14ae14a..fb8ae8ba0 100644 --- a/index.html +++ b/index.html @@ -1,4 +1,4 @@ - + Проект "Комменты" @@ -9,40 +9,8 @@
"use strict"; - // Код писать здесь - console.log("It works!"); + const comments = { + commentatorName: [], + commentText: [] + }; + const commentContainer = document.querySelector('.comments'); + document.querySelector('.add-form-button').addEventListener('click', () => { + const commName = document.querySelector('.add-form-name').value; + const commText = document.querySelector('.add-form-text').value; + if (commText.length === 0){ + alert('Напишите отзыв'); + return; + } + if(commName.length === 0){ + alert('Введите ваше имя'); + return; + } + comments.commentText.push(commText); + comments.commentatorName.push(commName); + function formatDate(dateInput) { + const date = new Date(dateInput); + + const day = String(date.getDate()).padStart(2, '0'); + const month = String(date.getMonth() + 1).padStart(2, '0'); + const year = String(date.getFullYear()).slice(-2); + const hours = String(date.getHours()).padStart(2, '0'); + const minutes = String(date.getMinutes()).padStart(2, '0'); + + return `${day}.${month}.${year} ${hours}:${minutes}`; + } + + document.querySelector('.add-form-name').value = ''; + document.querySelector('.add-form-text').value = ''; + + const commentCard = document.createElement('li'); + commentCard.classList.add('comment'); + + commentCard.innerHTML = ` +
+
${commName}
+
${formatDate(new Date())}
+
+
+
+ ${commText} +
+
+
+ +
+ `; + commentContainer.appendChild(commentCard); + }); + console.log(comments); +