☰

REDDIT: Comment Navigation

Navigate between parent comments on Reddit

目前为 2024-08-24 提交的版本。查看 最新版本。

  1. // ==UserScript==
  2. // @name         REDDIT: Comment Navigation
  3. // @namespace    https://github.com/KenKaneki73985/Reddit-Comment-Navigation
  4. // @version      1.0
  5. // @license      MIT
  6. // @description  Navigate between parent comments on Reddit
  7. // @author       Ken Kaneki 
  8. // @match        https://www.reddit.com/*
  9. // @grant        none
  10. // ==/UserScript==
  11.  
  12. // You can open issues at:
  13. // https://github.com/KenKaneki73985/Reddit-Comment-Navigation/issues
  14.  
  15. //  user_script = "moz-extension://762e4395-b145-4620-8dd9-31bf09e052de/options.html#nav=456d07d2-2ca3-4a29-bd4d-3d3b7726255f+editor"
  16.  
  17. (function() {
  18.     'use strict'
  19.     let current_index = -1
  20.     let PARENT_COMMENTS_arr = []
  21.  
  22.     function FIND_PARENT_COMMENTS() {
  23.         PARENT_COMMENTS_arr = []
  24.         const comments = document.querySelectorAll('shreddit-comment[depth="0"')
  25.         comments.forEach(comment => PARENT_COMMENTS_arr.push(comment))
  26.     }
  27.  
  28.     function NEXT_PARENT_COMMENT() {
  29.         FIND_PARENT_COMMENTS() // refresh new comments
  30.  
  31.         if (PARENT_COMMENTS_arr.length  > current_index + 1) {  // 5 (len) - 1 > 4 (index) ? 4 > 4 = false
  32.             current_index++
  33.             PARENT_COMMENTS_arr[current_index].scrollIntoView()
  34.             HIGHLIGHT_COMMENT(PARENT_COMMENTS_arr[current_index])
  35.             ADJUST_POSITION()
  36.         }
  37.     }
  38.  
  39.     function PREV_PARENT_COMMENT() {
  40.         FIND_PARENT_COMMENTS() // refresh new comments
  41.  
  42.         if (current_index > 0) {
  43.             current_index--
  44.             PARENT_COMMENTS_arr[current_index].scrollIntoView()
  45.             HIGHLIGHT_COMMENT(PARENT_COMMENTS_arr[current_index])
  46.             ADJUST_POSITION()
  47.         }
  48.     }
  49.  
  50.     function ADJUST_POSITION() {
  51.         window.scrollBy(0, -70); // Scroll up by 100 pixels
  52.     }
  53.  
  54.     function HIGHLIGHT_COMMENT(active_comment) {
  55.  
  56.         PARENT_COMMENTS_arr.forEach(comment => comment.style.border = "none") // Remove highlight from all comments
  57.         active_comment.style.border = '1px solid gray' // Highlight the current comment
  58.     }
  59.  
  60.     const prev_btn = document.createElement('button')
  61.     // prev_btn.innerHTML = '<svg viewBox="0 0 24 24" width="24" height="24"><path d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"/></svg>'
  62.     prev_btn.innerHTML = '<svg viewBox="0 0 24 24" width="24" height="24"><path fill="#808080" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"/></svg>'
  63.     // prev_btn.textContent = 'prev'
  64.     prev_btn.style.position = 'fixed'
  65.     prev_btn.style.right = '20px'
  66.     prev_btn.style.top = '83%'
  67.     prev_btn.addEventListener('click', PREV_PARENT_COMMENT)
  68.  
  69.     const next_btn = document.createElement('button')
  70.     next_btn.innerHTML = '<svg viewBox="0 0 24 24" width="24" height="24"><path fill="#808080" d="M7.41 8.59L12 13.17l4.59-4.58L18 10l-6 6-6-6 1.41-1.41z"/></svg>'
  71.     // next_btn.textContent = 'next'
  72.     next_btn.style.position = 'fixed'
  73.     next_btn.style.right = '20px'
  74.     next_btn.style.top = '90%'
  75.     next_btn.addEventListener('click', NEXT_PARENT_COMMENT)
  76.  
  77.     document.body.appendChild(prev_btn)
  78.     document.body.appendChild(next_btn)
  79.  
  80.     window.addEventListener('load', () => {current_index = -1})
  81.     window.addEventListener('load', FIND_PARENT_COMMENTS)
  82.     // window.addEventListener('scroll', FIND_PARENT_COMMENTS);
  83. })()
  84.