https://www.addevice.io/js/website/blog/comments.js

1const blogBtnClass = '.blogBtn';
2const mainBtnClass = '.mainBtn';
3const blogFormClass = '.blog-form';
4
5$(function () {
6
7  blogButtonClick();
8
9  formSubmit();
10
11  getTimeFromTimezone();
12
13  //customTextarea();
14
15  // hideForm();
16
17});
18
19function blogButtonClick() {
20  $(document).on('click', blogBtnClass, function (e) {
21    e.preventDefault()
22    showForm($(this));
23    //customTextarea();
24  })
25}
26
27function showForm(clickedBtn) {
28  $(blogFormClass).trigger("reset").find(".validation-error").html('');
29
30  $(mainBtnClass).addClass('d-none');
31
32  if (clickedBtn.hasClass('replyBtn')) {
33    $(blogFormClass).find("input[name='reply_to']").val(clickedBtn.closest('.comments-item').data('id'))
34  }
35
36  $(blogFormClass).addClass('show');
37
38  scrollToElement($(blogFormClass), 100);
39
40}
41
42// function hideForm() {
43//   $('.comments-form-close').on('click', function () {
44//     $(blogFormClass).removeClass('show');
45//   });
46// }
47
48function hideForm() {
49  $(mainBtnClass).removeClass('d-none');
50  $(blogFormClass).removeClass('show');
51
52  $('html, body').animate({
53    scrollTop: $('.comments').offset().top - 300,
54  }, 200);
55
56  $(blogFormClass).trigger("reset");
57  $(mainBtnClass).text("Thank you for your time")
58}
59
60function formSubmit() {
61  $(document).on('submit', blogFormClass, function (e) {
62    e.preventDefault();
63    formSubmitAjax();
64  })
65}
66
67function formSubmitAjax() {
68  const sendData = new FormData($(blogFormClass)[0]);
69  sendData.append('body', $('#comment').html());
70
71  $(blogFormClass).find('.validation-error').text('');
72
73  $.ajax({
74    type: "POST",
75    url: $(blogFormClass).attr('action'),
76    data: sendData,
77    processData: false,
78    contentType: false,
79    success: function (data) {
80      hideForm();
81    },
82    error: function (errors) {
83      $.each(errors.responseJSON.errors, function (key, value) {
84
85        $(blogFormClass).find('#form-error-' + key).text(value);
86
87        scrollToFirstErrorAndStyle($(blogFormClass))
88      });
89    }
90  })
91}
92
93function getTimeFromTimezone() {
94
95  let offset = new Date().getTimezoneOffset();
96  let createdAt, time, createdAtForTimezone;
97  let year, month, day, hour, minutes;
98  $.each($('.comments .comments-user'), function (key, value) {
99    time = $(this).find('time');
100    createdAt = new Date(time.attr('datetime'))
101    createdAtForTimezone = new Date(createdAt.getTime() - offset * 60000);
102
103    year = createdAtForTimezone.getFullYear();

104    month = createdAtForTimezone.getMonth() + 1;
105    day = createdAtForTimezone.getDate();
106    hour = createdAtForTimezone.getHours();
107    minutes = createdAtForTimezone.getMinutes();
108
109    let formattedDate = ('0' + day).slice(-2) + '.' + ('0' + month).slice(-2) + '.' + year + ' at ' + ('0' + hour).slice(-2) + ':' + ('0' + minutes).slice(-2);
110
111    time.html(formattedDate);
112  })
113
114}