Staticman Script in Pure JS

Staticman without jQuery

The official Staticman script sample depends on jQuery. I have been using jQuery in my Staticman script for nested comments for more than six months.

Recently, in the new release of Hugo Swift Theme, in which I’m a collaborator, one has removed all jQuery methods at commit f137efa4. Here’s the structure of the script:

  1. auxiliary functions like elem, elems, pushClass, deleteClass, etc.
  2. A self-executing function comments()
    • some necessary local variables
    • handleForm() consisting merely of an event listener handling form submission.
      • formToJSON(form) for converting the comment form to a JSON string.
      • fetch(url, {...}).then(...).catch(...) for submitting a sever request and handling its response. It calls showModal(...) and it contains resetForm().
    • a conditional form ? handleForm(form) : false; to execute the above method provided the existence of the comment form.
    • closeModal() and showModal() for closing and showing the modal respectively.
    • a conditional containsClass(body, show) ? closeModal() : false;.
    • a self-executing toogleForm() function. Nesting a self-executing function inside another one limits the namespace of variables. Even though there’s no new variable defined inside this function, there’s a need to wrap it with parenthesis () because toggleForm() is not called elsewhere, unlike toggleMeun(). If the if(button){...} statement comes out directly, we will not know that it’s doing.

No comment

Your email address will not be published. Required fields are marked *.