2 files changed, 35 insertions, 1 deletions
diff --git a/youtube/static/js/comments.js b/youtube/static/js/comments.js
new file mode 100644
index 0000000..845ed3e
--- /dev/null
+++ b/youtube/static/js/comments.js
@@ -0,0 +1,20 @@
+function onClickReplies(e) {
+  var details = e.target.parentElement;
+  // e.preventDefault();
+  console.log("loading replies ..");
+  doXhr(details.getAttribute("src") + "&slim=1", (html) => {
+    var div = details.querySelector(".comment_page");
+    div.innerHTML = html;
+  });
+  details.removeEventListener('click', onClickReplies);
+}
+
+window.addEventListener('DOMContentLoaded', function() {
+    QA("details.replies").forEach(details => {
+      details.addEventListener('click', onClickReplies);
+      details.addEventListener('auxclick', (e) => {
+        if (e.target.parentElement !== details) return;
+        if (e.button == 1) window.open(details.getAttribute("src"));
+      });
+    });
+});
+\ No newline at end of file
diff --git a/youtube/static/js/common.js b/youtube/static/js/common.js
index 687c6fa..2997f61 100644
--- a/youtube/static/js/common.js
+++ b/youtube/static/js/common.js
@@ -1,4 +1,5 @@
 Q = document.querySelector.bind(document);
+QA = document.querySelectorAll.bind(document);
 function text(msg) { return document.createTextNode(msg); }
 function clearNode(node) { while (node.firstChild) node.removeChild(node.firstChild); }
 function toTimestamp(seconds) {
@@ -36,6 +37,19 @@ function getDefaultTranscriptTrackIdx() {
   return textTracks.length - 1;
 }
 
+function doXhr(url, callback=null) {
+    var xhr = new XMLHttpRequest();
+    xhr.open("GET", url);
+    xhr.onload = (e) => {
+      let ok = xhr.status >= 200 && xhr.status < 300;
+      if (ok) callback(e.currentTarget.response);
+      else alert(`${xhr.responseURL} status code: ${xhr.status}`);
+    }
+    xhr.send();
+    return xhr;
+}
+
+
 window.addEventListener('DOMContentLoaded', function() {
     cur_track_idx = getDefaultTranscriptTrackIdx();
-});
+});
+\ No newline at end of file