diff --git a/webroot/comments.shs b/webroot/comments.shs index 6a5742c..33aed53 100755 --- a/webroot/comments.shs +++ b/webroot/comments.shs @@ -24,7 +24,7 @@ comments="$(curl -s 'https://www.youtube.com/youtubei/v1/next?key=AIzaSyAO_FJ2Sl jq -r 'select(.commentsHeaderRenderer) | "

(whole \(.commentsHeaderRenderer.countText.runs[0].text) of them)

"' <<< "$comments" | head -1 - jq -r 'if (.commentThreadRenderer != null) then + jq -r '(if (.commentThreadRenderer != null) then .commentThreadRenderer | select(.comment.commentRenderer.authorText.simpleText != null) else .commentRenderer @@ -38,6 +38,13 @@ comments="$(curl -s 'https://www.youtube.com/youtubei/v1/next?key=AIzaSyAO_FJ2Sl (.contentText.runs[] | if .bold == true then "\(.text)" else .text end), (select(.voteCount.simpleText != null) | "
\(.voteCount.simpleText) liked") ), - (select(.replies.commentRepliesRenderer) | "
Show replies
") + (select(.replies.commentRepliesRenderer) | "
Show replies
")) ' <<< "$comments" | sed -E 's/^$/
/g' - + echo "" + + jq -r ' + if (.continuationItemRenderer.continuationEndpoint) then + "
Load more...
" + else + "
More replies...
" + end' <<< "$comments" | tail -1 diff --git a/webroot/css/style.css b/webroot/css/style.css index c7ad78c..5cec44c 100644 --- a/webroot/css/style.css +++ b/webroot/css/style.css @@ -9,10 +9,13 @@ pre { margin-top: 5px; margin-bottom: 15px; } -.comment-thread, .show-more { +.comment-thread, { margin-left: 16px; } - +.show-more { + cursor: pointer; + color: #3d3; +} .hide-cursor { cursor: none; } diff --git a/webroot/js/watch.js b/webroot/js/watch.js index f5f99aa..13a500d 100644 --- a/webroot/js/watch.js +++ b/webroot/js/watch.js @@ -1,43 +1,42 @@ -window.addEventListener("load", () => { - const comments = document.querySelector(".comments"); - const id = new URLSearchParams(document.location.search).get("v"); +const comments = document.querySelector(".comments"); +const id = new URLSearchParams(document.location.search).get("v"); - function showMore(e) { - let a = e.target.cloneNode(true); - a.classList.remove("show-more"); - a.classList.add("comment-thread"); - e.target.replaceWith(a); - fetchComments(a, a.dataset.uwu); - } - - function fetchComments(div, cont) { - div.innerText = "Loading..."; - if(!cont) { - url = "/comments.shs?v=" + id; - } else { - url = "/comments.shs?cont=" + cont; +function showMore(e) { + if (e.target.classList.contains("show-more")) { + e.target.classList.remove("show-more"); + if(e.target.dataset.fun == "replies") { + e.target.classList.add("comment-thread"); } - fetch(url).then( - res => { - if (res.status !== 200) { - throw new Error('HTTP Error ' + res.status); - } - return res.text(); - } - ).then( - res => { - div.innerHTML = res; - if(!cont) { - let show_more = document.querySelectorAll(".show-more"); - show_more.forEach((elem) => { - elem.addEventListener("click", (e) => showMore(e)); - }); - } - } - ).catch( - err => div.innerText = 'Error during fetching comments: ' + err.message - ) + fetchComments(e.target, e.target.dataset.uwu); } +} +function fetchComments(div, cont) { + div.innerText = "Loading..."; + if(!cont) { + url = "/comments.shs?v=" + id; + } else { + url = "/comments.shs?cont=" + cont; + } + fetch(url).then( + res => { + if (res.status !== 200) { + throw new Error('HTTP Error ' + res.status); + } + return res.text(); + } + ).then( + res => { + div.innerHTML = res; + } + ).catch( + err => div.innerText = 'Error during fetching comments: ' + err.message + ) +} + + +window.addEventListener("load", () => { fetchComments(comments); }) + +window.addEventListener("click", (e) => showMore(e));