feat: add more logging to JS

static/comments/getcomments.js

@@ -4,6 +4,18 @@
   SPDX-FileCopyrightText: 2019 Björn Schießle
 */
 
+// Debug logging helper
+var debugEnabled = false;
+function debugLog(message, data) {
+    if (debugEnabled) {
+        if (data !== undefined) {
+            console.log('[Mastodon Comments] ' + message, data);
+        } else {
+            console.log('[Mastodon Comments] ' + message);
+        }
+    }
+}
+
 $(document).ready(function() {
 
     // check if we show a blog post or not. Regex is defined in site-wide config
@@ -14,6 +26,8 @@ $(document).ready(function() {
         return;
     }
 
+    debugLog('Searching for comments for: ' + RelPermalink);
+
     $.ajax({
         url: "/comments/getcomments.php",
         type: "get",
@@ -21,13 +35,30 @@ $(document).ready(function() {
             search : RelPermalink
         },
         success: function(data) {
+            // Enable debug logging if backend has debug enabled
+            if (data.debug === true) {
+                debugEnabled = true;
+                debugLog('Debug mode enabled');
+            }
+
+            debugLog('Received data from backend', data);
+
             var stats = data.stats;
             var root = data.stats.root;
+
+            debugLog('Stats - Favs: ' + stats.favs + ', Reblogs: ' + stats.reblogs + ', Replies: ' + stats.replies);
+            debugLog('Root toot ID: ' + root);
+
             $("#like-count-container").append('<div id="mastodon-like-count"><a href="' + stats.url + '"><span title="Likes"><i class="fa fa-star"></i>' + stats.favs + '</span></a></div></div>');
             $("#reblog-count-container").append('<div id="mastodon-reblog-count"><a href="' + stats.url + '"><span title="Reblogs"><i class="fa fa-retweet"></i>' + stats.reblogs + '</span></a></div></div>');
             $("#reply-count-container").append('<div id="mastodon-reply-count"><a href="' + stats.url + '"><span title="Comments"><i class="fa fa-comments"></i>' + stats.replies + '</span></a></div></div>');
+
             var comments = data.comments;
+            var commentCount = Object.keys(comments).length;
+            debugLog('Processing ' + commentCount + ' comments');
+
             $.each(comments, function(key, value) {
+                debugLog('Adding comment: ' + key, value);
                 var timestamp = Date.parse(value.date);
                 var date = new Date(timestamp);
                 var comment = "<div class='comment' id='" + key + "'>";
@@ -39,19 +70,28 @@ $(document).ready(function() {
                 var parentComment = document.getElementById(value.reply_to);
                 if (value.reply_to === root || parentComment === null) {
                     $("#comments").append(comment);
+                    debugLog('  → Added as top-level comment');
                 } else {
                     var selector = '#'+value.reply_to;
                     $(selector).append(comment);
+                    debugLog('  → Added as reply to: ' + value.reply_to);
                 }
             });
+
             if (parseInt(root) > 0) {
                 $("#reference").append("<a href='" + MastodonUser + "/statuses/" + root + "'>Join the discussion on Mastodon!</a>");
+                debugLog('Added Mastodon discussion link for root: ' + root);
             } else {
                 $("#comments").empty();
                 $("#statistics").empty();
                 $("#reference").append("Comments are handled by my <a href='" + MastodonUser + "'>Mastodon account</a>. Sadly this article wasn't published at Mastodon. Feel free to <a href='" + CommentsContact + "'>send me a mail</a> if you want to share your thoughts regarding this topic.");
+                debugLog('No Mastodon toot found for this article');
             }
 
+        },
+        error: function(xhr, status, error) {
+            console.error('[Mastodon Comments] AJAX Error:', status, error);
+            console.error('[Mastodon Comments] Response:', xhr.responseText);
         }
     });
 });

static/comments/getcomments.php

@@ -257,6 +257,9 @@ header('Expires: Mon, 26 Jul 1997 05:00:00 GMT');
 // headers to tell that result is JSON
 header('Content-type: application/json');
 
+// add debug flag to result for JavaScript console logging
+$result['debug'] = $debug_on;
+
 // actually output result as JSON, to be digested by getcomments.js
 echo json_encode($result);