/*

Static comments for Editorial, compiled/revised by Middle Bear
middlebear.org | github.com/middlebear
Free for personal and commercial use under the CCA 3.0 license (/license.txt
and http://creativecommons.org/licenses/by/3.0/)

from: https://github.com/eduardoboucas/popcorn/blob/gh-pages/js/main.js
via:  https://mademistakes.com/articles/improving-jekyll-static-comments/
and   https://spinningnumbers.org/a/staticman-heroku.html
and   https://travisdowns.github.io/blog/2020/02/05/now-with-comments.html

*/

(function ($) {

var $comments = $('.js-comments');

$('.js-form').submit(function () {
  var form = this;

  $(form).addClass('disabled');
  //Spinner from Travis Downs and MadeMistakes
  $('#comment-form-submit').html('<i class="fas fa-spinner fa-spin fa-fw"></i>  Submitting');

  $.ajax({
    type: $(this).attr('method'),
    url:  $(this).attr('action'),
    data: $(this).serialize(),
    contentType: 'application/x-www-form-urlencoded',
    success: function (data) {
      showModal('Comment submitted', 'Thanks! Your comment is pending. It will appear when approved.');
      //Spinner
      $('#comment-form-submit').html('Submit');
      // $(form)[0].reset();   // clear contents of form after submit
      $(form).removeClass('disabled');
      // grecaptcha.reset();
    },
    error: function (err) {
      console.log(err);
      //Spinner
      var ecode = (err.responseJSON || {}).errorCode || "unknown";
      showModal('Error', 'An error occured.<br>[' + ecode + ']');
      $('#comment-form-submit').html('Submit');
      $(form).removeClass('disabled');
      // grecaptcha.reset();
    }
  });
  return false;
});

$('.js-close-modal').click(function () {
  $('body').removeClass('show-modal');
});

function showModal(title, message) {
  $('.js-modal-title').text(title);
  $('.js-modal-text').html(message);
  $('body').addClass('show-modal');
}

})(jQuery);

// jquary version of moving form - incomplete: need to reset form/reply button after completion/cancel // var replyButtons = $('.js-reply.button'); // var commentForm = $('.js-form.comment-form'); // var cancelButton = $('#cancel-comment-reply-link'); // replyButtons.on('click', function () { // comment = $(this).closest('article.js-comment'); // $(this).after(commentForm); // $(this).replaceWith(cancelButton); // commentForm.children('#comment-parent-id').val(comment.attr('data-id')); // console.log('data id: '+comment.attr('data-id')); // console.log(comment); // console.log(commentForm); // console.log('hidden parent id: '+commentForm.children('#comment-parent-id').val()); // });

/*

Staticman comment replies for Editorial, refactored by Middle Bear
middlebear.org | github.com/middlebear
Released under the GNU General Public License - https://wordpress.org/about/gpl/
as per the original Wordpress licensing

from: https://github.com/mmistakes/made-mistakes-jekyll
via:  https://core.svn.wordpress.org/trunk/wp-includes/js/comment-reply.js
and   https://spinningnumbers.org/a/staticman-heroku.html
and   https://travisdowns.github.io/blog/2020/02/05/now-with-comments.html

*/

// addComment.moveForm is called from comment.html when the reply link is clicked. // modified to add and use event listeners rather than `onclick` attributes var addComment = {

moveForm: function(commentId, parentId, commentFormDivId, pageSlug, placeAfterThisClass, parentUuid) {
  var div, element, style, cssHidden,
  t               = this,                                     // t is the addComment object, with functions moveForm and I, and variable commentFormDivId
  comment         = t.I(commentId),                           // whole comment
  commentFormDiv  = t.I(commentFormDivId),                    // whole new comment form
  cancel          = t.I('cancel-comment-reply-link'),         // whole reply cancel link
  parent          = t.I('comment-parent-id'),                 // hidden element for long id of parent comment
  parentFragment  = t.I('comment-parent-fragment'),           // hidden element for link fragment to parent
  post            = t.I('comment-post-slug'),                 // null
  commentForm     = commentFormDiv.getElementsByTagName('form')[0];  // the <form> part of the comment_form div

  if ( ! comment || ! commentFormDiv || ! cancel || ! parent || ! parentFragment || ! commentForm) { return; }
  t.commentFormDivId = commentFormDivId;
  pageSlug = pageSlug || false;

  // create and insert a bookmark div right before comment form
  if ( ! t.I('sm-temp-form-div')) {
    div               = document.createElement('div');
    div.id            = 'sm-temp-form-div';
    div.style.display = 'none';
    commentFormDiv.parentNode.insertBefore(div, commentFormDiv);
  }

  var placeAfterThisElement = comment.querySelector(placeAfterThisClass);
  placeAfterThisElement.insertAdjacentElement('afterend', commentFormDiv);  // move form from bottom to just after the comment child element with placeAfterThisClass
  // comment.parentNode.insertBefore(commentFormDiv, comment.nextSibling);  // move the form from the bottom to above the next sibling
  if (post && pageSlug) { post.value = pageSlug; }
  parent.value = parentUuid;
  parentFragment.value = commentId;
  cancel.style.display = '';                                  // make the cancel link visible

  cancel.onclick = function() {
    var t           = addComment,
    temp            = t.I('sm-temp-form-div'),                // temp is the original bookmark
    commentFormDiv  = t.I(t.commentFormDivId);                // commentFormDiv is the comment form

    if ( ! temp || ! commentFormDiv) { return; }

    t.I('comment-parent-id').value = null;                    // forget the parent of the comment
    t.I('comment-parent-fragment').value = null;              // forget the parent link of the comment
    temp.parentNode.insertBefore(commentFormDiv, temp);       // move the comment form to its original location
    temp.parentNode.removeChild(temp);                        // remove the bookmark div
    this.style.display = 'none';                              // make the cancel link invisible
    this.onclick = null;                                      // retire the onclick handler
    return false;
  };

  /*
   * Set initial focus to the first form focusable element.
   * Try/catch used just to avoid errors in IE 7- which return visibility
   * 'inherit' when the visibility value is inherited from an ancestor.
   */
  try {
    for (var i = 0; i < commentForm.elements.length; i++) {
      element = commentForm.elements[i];
      cssHidden = false;

      // Modern browsers.
      if ('getComputedStyle' in window) {
        style = window.getComputedStyle(element);
      // IE 8.
      } else if (document.documentElement.currentStyle) {
        style = element.currentStyle;
      }

    /*
     * For display none, do the same thing jQuery does. For visibility,
     * check the element computed style since browsers are already doing
     * the job for us. In fact, the visibility computed style is the actual
     * computed value and already takes into account the element ancestors.
     */
      if ((element.offsetWidth <= 0 && element.offsetHeight <= 0) || style.visibility === 'hidden') {
        cssHidden = true;
      }
      if ('hidden' === element.type || element.disabled || cssHidden) { continue; }
      element.focus();
      break;                                                  // Stop after the first focusable element.
    }

  } catch(er) {}

  return false;
},

I: function(id) { return document.getElementById(id); }

};

// Attach event listeners to reply buttons, rather than including tem in the html - Middlebear document.querySelectorAll(“.js-reply.button”).forEach(function(el) {

// must use block-scoped vars ('let', not 'var') here for returned function to have customized values
let commentId = el.closest('.js-comment').id,
parentId      = el.closest('.js-comment').closest('article').id,
parentUuid    = el.closest('.js-comment').closest('article').getAttribute('data-id'),
pageSlug      = document.querySelector('#comment-form input[name="options[slug]"]').value;

el.addEventListener('click', function(e) {
  // e.preventDefault();
  return addComment.moveForm(commentId, parentId, 'comment-form', pageSlug, '.actions', parentUuid); // edit strings for commentFormDivId and placeAfterThisClass here as needed
});

});