jQuery & IE-compatible Staticman integration

_config.yml

@@ -172,8 +172,6 @@ staticman:
     siteKey  : "6Ld3U1EaAAAAAKCI4HO5l4GJZYMS1-3-TcbhRZxK"
     secret   : "rnt+eb2ENO1iNdsN1Jwn/Rtqe/n5r37/6HTXrtaGydMlVABw19bMUngZq59iPvRNkAasKpg3LR4m6MADQcC+qd+YR/JTMPa+/TDhvtEjVsxGS0wYqj/vqCD8pRHLvoLTBUkFXEXcHiafVl3dOYxe+DmQpOgxCfBN7Lts7tpHVAHJ+ne3Kq3/lsLkUgDHYOXHULufF8A5WqIWP9raBRyNu4+LFjfVy4B8UaiCf0EQMIL27hpMzyEVPmZ5sDratpWzZGcFfa7oDrfbSGnw4wUFqDJooOvA2a/DY2uAqdsg1V9F65FggPEemZncAsf68RNRE+s0z+V/Ws78SAfchWhdGWyJiQyFFPSZ8JbYG0khoQ6/ufllEoMMpSiru33OPtvKmPx/sQBc+jAYyfCSKkYS3ObcCXNMQLxRI2T4Ice61bFG15pj/7Dyn72kPMLqyuQ9cp4/Fbb/TBkn7DxidxWkGtglxItHH55yfeWA1r3KO2J2wpcb4FrM30zSmG5sk3SMVchOA1jeKC+vhTR9D7UKBv8pNyN/RZ7r3s1URzLk6js4NvPmL+c8ktOMsFopGKgummPjlKGdpk/0bn5xi0D3Vvd1ixa34zqFa+Ar1TKoh6/b+GCbxxjYOoizZ/xiQuy2y1itY31JpES+pv6Z643tcj64G7iVQ708WrnWo9YHUU8="
 
-staticman_url: https://amir-staticman.herokuapp.com/v2/entry/starwards/starwards.github.io/master/comments
-
 # --- Misc --- #
 
 # Ruby Date Format to show dates of posts

_includes/staticman-comments.html

@@ -75,7 +75,7 @@ <h3 class="page__comments-title">{{ site.data.ui-text[site.locale].comments_labe
   <!-- doing something a bit funky here because I want to be careful not to include JQuery twice! -->
   <script>
     if (typeof jQuery == 'undefined') {
-      document.write('<script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></scr' + 'ipt>');
+      document.write('<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></scr' + 'ipt>');
     }
   </script>
   <script src="{{ "/assets/js/staticman.js" | relative_url }}"></script>

_layouts/base.html

@@ -9,8 +9,8 @@
   - "https://fonts.googleapis.com/css?family=Lora:400,700,400italic,700italic"
   - "https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800"
 common-ext-js:
-  - href: "https://code.jquery.com/jquery-3.5.1.min.js"
-    sri: "sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0="
+  - href: "https://code.jquery.com/jquery-3.5.1.slim.min.js"
+    sri: "sha256-4+XzXVhsDmqanXGHaHvgh1gMQKX40OUvDEBTu8JcmNs="
   - href: "https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"
     sri: "sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
   - href: "https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"

_layouts/minimal.html

@@ -5,8 +5,8 @@
   - href: "https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
     sri: "sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh"
 common-ext-js:
-  - href: "https://code.jquery.com/jquery-3.5.1.min.js"
-    sri: "sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0="
+  - href: "https://code.jquery.com/jquery-3.5.1.slim.min.js"
+    sri: "sha256-4+XzXVhsDmqanXGHaHvgh1gMQKX40OUvDEBTu8JcmNs="
   - href: "https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"
     sri: "sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
   - href: "https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"

assets/js/staticman.js

@@ -14,29 +14,42 @@ layout: null
     var endpoint = '{{ sm.endpoint }}';
     var repository = '{{ sm.repository }}';
     var branch = '{{ sm.branch }}';
+    let url = endpoint + repository + '/' + branch + '/comments';
+    let data = $(this).serialize();
 
-    $.ajax({
-      type: $(this).attr('method'),
-      url: endpoint + repository + '/' + branch + '/comments',
-      data: $(this).serialize(),
-      contentType: 'application/x-www-form-urlencoded',
-      success: function (data) {
-        $('#comment-form-submit').addClass('d-none');
-        $('#comment-form-submitted').removeClass('d-none');
-        $('.page__comments-form .js-notice').removeClass('alert-danger');
-        $('.page__comments-form .js-notice').addClass('alert-success');
-        showAlert('success');
-      },
-      error: function (err) {
-        console.log(err);
-        $('#comment-form-submitted').addClass('d-none');
-        $('#comment-form-submit').removeClass('d-none');
-        $('.page__comments-form .js-notice').removeClass('alert-success');
-        $('.page__comments-form .js-notice').addClass('alert-danger');
-        showAlert('failure');
-        $(form).removeClass('disabled');
+    var xhr = new XMLHttpRequest();
+    xhr.open("POST", url);
+    xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
+    xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
+    xhr.onreadystatechange = function () {
+      if(xhr.readyState === XMLHttpRequest.DONE) {
+        var status = xhr.status;
+        if (status >= 200 && status < 400) {
+          formSubmitted();
+        } else {
+          formError();
+        }
       }
-    });
+    };
+
+    function formSubmitted() {
+      $('#comment-form-submit').addClass('d-none');
+      $('#comment-form-submitted').removeClass('d-none');
+      $('.page__comments-form .js-notice').removeClass('alert-danger');
+      $('.page__comments-form .js-notice').addClass('alert-success');
+      showAlert('success');
+    }
+
+    function formError() {
+      $('#comment-form-submitted').addClass('d-none');
+      $('#comment-form-submit').removeClass('d-none');
+      $('.page__comments-form .js-notice').removeClass('alert-success');
+      $('.page__comments-form .js-notice').addClass('alert-danger');
+      showAlert('failure');
+      $(form).removeClass('disabled');
+    }
+
+    xhr.send(data);
 
     return false;
   });