Форма додання коментарів, можливість додавати до повідомлення смайли, можливість лайкати, відповідати на коментарі та їх видаляти, очищення форми, робота з Cookie LocalStorage. Сам сайт зверстаний, при співпраці надам верстку. Використовувати нативний Js і/або jQuery.
ТЗ:
Вимоги — технічне завдання:
1. Додати :hover, :focus ефекти для інтерактивних елементів
2. Форма додання коментарів:
2.1. Поля: Name, Email, Message – обов’язкові, website – опційне.
2.2. Валідація:
Перевірка полів форми:
Name – Тільки букви (латиниця) і цифри
Email – Перевірка на правильний формат адреси
Website – Дозволенні символи A-Za-z0-9 . : -
Message – не менше 15 і не більше 500 символів.
3. Реалізувати можливість додавати до повідомлення смайли.
Кожному зі смайликів призначити унікальний код. Якщо користувач тисне на відповідний смайлик, його код додається у повідомлення у вигляді [::code::] (код додається в кінець повідомлення)
Після того, як користувач натисне кнопку Post, всі коди мають бути замінені на відповідні смайлики у тексті повідомлення.
4. При натисканні на кнопку Cancel форма очищується.
4.1. Якщо був вибраний пункт Save my name, email, and website in this browser for the next time I comment, він також має набути значення “вимкнений”.
5. Save my name, email, and website in this browser for the next time I comment.
Якщо користувач вибере цей пункт, дані, введені в поля Name, Email, Website, мають підтягуватися після перезавантаження сторінки, за умови, що користувач, додав хоча б один коментар.
6. Коментарі:
Реалізувати можливість лайкати повідомлення. Цей функціонал має бути тільки у головних повідомлень. Користувач може натиснути на сердечко, після цього сердечко змінює колір і цифра збільшується на 1.
7. Реалізувати можливість відповідати на коментар. Після натискання кнопки Reply користувач заповнює форму. Коли натисне кнопку Post, створюється не новий коментар, а відповідь під тим, на який натиснуто Reply, згідно з макетом. До відповіді додається ім’я користувача, на чиє повідомлення дається відповідь. Ієрархія відповідей не створюється, тобто є тільки головне повідомлення і всі відповіді під ним. Коли користувач відповідає на іншу відповідь, його повідомлення з’являється просто нижче, і у цій відповіді відмічене лише ім’я користувача, на чиє повідомлення відповіли.
8.1. Реалізувати видалення головних коментарів.
При натисканні на відповідну кнопку головний коментар і всі відповіді на нього видаляються.