☰

LRC Live

Live-update (auto-refresh) LetsRun.com threads and get notified when new posts come in

  1. // ==UserScript==
  2. // @name        LRC Live
  3. // @namespace   lrc-live
  4. // @description Live-update (auto-refresh) LetsRun.com threads and get notified when new posts come in
  5. // @match       https://www.letsrun.com/forum/flat_read.php*
  6. // @version     1.3
  7. // @grant       none
  8. // ==/UserScript==
  9.  
  10. const urlParams = new URLSearchParams(window.location.search);
  11. const pageNo = +urlParams.get('page') || 0;
  12. const pages = document.querySelector('span.items-stretch')?.querySelectorAll('a[aria-label="pagination.goto_page"]') || [];
  13. const lastPage = +pages[pages.length - 1]?.innerText || 0;
  14.   
  15. if (pageNo === lastPage) {
  16.   const template = document.createElement('template');
  17.   template.innerHTML = '<a role="button" title="Toggle LRC Live" class="button font-bold button-red shadow-md mt-2" style="width: 100%">Start LRC Live</a>';
  18.   const liveButton = template.content.firstChild;
  19.  
  20.   const threadContainer = document.querySelector('div.forum-thread-page-container');
  21.   threadContainer.parentNode.insertBefore(liveButton, threadContainer.nextSibling);
  22.  
  23.   const thread = +urlParams.get('thread');
  24.   const posts = document.querySelectorAll('li.forum-post-container');
  25.   const postIds = [...posts].map(post => post.querySelector('div').getAttribute('id'));
  26.   const postList = document.querySelector('ul.post-list');
  27.   const postCountText = document.querySelector('p.text-gray-700');
  28.   const postCounters = postCountText ? [...postCountText.querySelectorAll('span.font-semibold')].slice(1) : [];
  29.   let wireKey = posts.length;
  30.   let checkPageNo = posts.length === 20 ? pageNo + 1 : pageNo;
  31.  
  32.   let enabled = false;
  33.   let interval;
  34.   liveButton.addEventListener('click', async () => {
  35.     liveButton.classList.toggle('button-red');
  36.     liveButton.classList.toggle('button-green');
  37.     enabled = !enabled;
  38.     
  39.     if (enabled) {
  40.       liveButton.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" class="default-icon dbr-spin mr-2 h-3 w-3"><path d="M296 48c0 22.091-17.909 40-40 40s-40-17.909-40-40 17.909-40 40-40 40 17.909 40 40zm-40 376c-22.091 0-40 17.909-40 40s17.909 40 40 40 40-17.909 40-40-17.909-40-40-40zm248-168c0-22.091-17.909-40-40-40s-40 17.909-40 40 17.909 40 40 40 40-17.909 40-40zm-416 0c0-22.091-17.909-40-40-40S8 233.909 8 256s17.909 40 40 40 40-17.909 40-40zm20.922-187.078c-22.091 0-40 17.909-40 40s17.909 40 40 40 40-17.909 40-40c0-22.092-17.909-40-40-40zm294.156 294.156c-22.091 0-40 17.909-40 40s17.909 40 40 40c22.092 0 40-17.909 40-40s-17.908-40-40-40zm-294.156 0c-22.091 0-40 17.909-40 40s17.909 40 40 40 40-17.909 40-40-17.909-40-40-40z"></path></svg> LRC Live is running, new posts in this thread will appear above... (click to stop)';
  41.       
  42.       const perm = await Notification.requestPermission();
  43.       const notify = perm === 'granted';
  44.       
  45.       interval = window.setInterval(async () => {
  46.         try {
  47.           const url = 'https://www.letsrun.com/forum/flat_read.php?' + new URLSearchParams({ thread, page: checkPageNo });
  48.           const checkPage = await fetch(url);
  49.           const checkPageText = await checkPage.text();
  50.           const checkPageDoc = new DOMParser().parseFromString(checkPageText, 'text/html');
  51.           const checkPosts = checkPageDoc.querySelectorAll('li.forum-post-container');
  52.           [...checkPosts].forEach(post => {
  53.             const postDiv = post.querySelector('div');
  54.             const postId = postDiv.getAttribute('id');
  55.             if (postIds.includes(postId)) return;
  56.             postIds.push(postId);
  57.             postDiv.setAttribute('wire:key', wireKey++);
  58.             if (postDiv.classList.contains('mt-0')) {
  59.               postDiv.classList.remove('mt-0');
  60.               postDiv.classList.add('mt-1');
  61.             }
  62.             postList.appendChild(post);
  63.             postCounters.forEach(pc => pc.innerText = +pc.innerText + 1);
  64.             if (notify) {
  65.               const n = new Notification(`LRC Live: New post in "${document.title}"`, { body: post.querySelector('div.post-body').innerText, icon: '/assets/images/letsrun-logo.png' });
  66.               document.addEventListener('visibilitychange', () => {
  67.                 if (document.visibilityState === 'visible') n.close();
  68.               });
  69.             }
  70.           });
  71.           if (checkPosts.length === 20) checkPageNo++;
  72.         } catch (err) { console.error(err); }
  73.       }, 5000);
  74.     } else {
  75.       liveButton.innerText = 'Start LRC Live';
  76.       window.clearInterval(interval);
  77.     }
  78.   });
  79. }