// ==UserScript==
// @name             Lemmy Infinite Scrolling and Comment Sort
// @description      Implements infinite scrolling and changes default sorting behavior.
// @version          0.2
// @author           draivin@lemmy.world
// @run-at           document-start
// @grant            none
// @match            https://sh.itjust.works/*
// @match            https://burggit.moe/*
// @match            https://lemmy.world/*
// @match            https://lemm.ee/*
// @match            https://lemmy.ml/*
// @match            https://lemmynsfw.com/*
// ==/UserScript==


// Don't forget to add your home instance to the match list above.


const defaultSort = 'Top';

function addScript(text) {
  text = text.replaceAll(`commentSort:"Hot"`, `commentSort:"${defaultSort}"`);
  text = text.replaceAll(
    'this.state.postsRes.data.posts',
    `(window.LEAKED_HOME=this,this.state.postsRes.data.posts)`
  );
  var newScript = document.createElement('script');
  newScript.type = 'text/javascript';
  newScript.textContent = text;
  var head = document.getElementsByTagName('head')[0];
  head.appendChild(newScript);
}

window.addEventListener('beforescriptexecute', async function (e) {
  const src = e.target.src;
  if (src.endsWith('client.js')) {
    e.preventDefault();
    e.stopPropagation();
    const response = await fetch(src);
    addScript(await response.text());
  }
});

let currentPage = 1;
let ongoingRequest = false;

let lastUrl = location.href;
const observer = new MutationObserver(() => {
  if (location.href !== lastUrl) {
    lastUrl = location.href;
    currentPage = Number(new URLSearchParams(location.search).get('page') ?? 1);
    ongoingRequest = false;
  }

  if (document.querySelector('.post-listings') && document.querySelector('.paginator button')) {
    if (document.querySelectorAll('.post-listing').length < 20) {
      showEndMessage();
    } else {
      clearPaginator();
    }
  }
});

observer.observe(document.documentElement, { childList: true, subtree: true });

window.addEventListener('scroll', async function (e) {
  const referenceBox = document.querySelector('.post-listings')?.getBoundingClientRect();

  if (scrollY == 0 || ongoingRequest || !referenceBox || !LEAKED_HOME) return;

  if (LEAKED_HOME.state.postsRes.data.posts.length < 20) {
    showEndMessage();
    return;
  }

  if (innerHeight + 300 > referenceBox.bottom) {
    ongoingRequest = true;
    currentPage += 1;

    const authToken = document.cookie.split('=')[1];
    const communityName = location.pathname.split('/')[2] ?? '';

    let { sort, listing } = getSortAndListing();

    let query = new URLSearchParams({
      page: currentPage,
      limit: 20,
      sort: sort,
      type_: listing,
      auth: authToken,
    });

    if (communityName) {
      query.set('community_name', communityName);
    }

    try {
      const curHome = LEAKED_HOME;

      showSpinner();

      const response = await fetch(`${location.origin}/api/v3/post/list?${query.toString()}`);
      const posts = (await response.json()).posts;

      if (LEAKED_HOME != curHome) {
        return;
      }

      clearPaginator();

      LEAKED_HOME.state.postsRes.data.posts.push(...posts);
      LEAKED_HOME.forceUpdate();

      if (posts.length == 20) {
        ongoingRequest = false;
      } else {
        showEndMessage();
      }
    } catch {
      ongoingRequest = false;
    }
  }
});

function getSortAndListing() {
  const queryParams = new URLSearchParams(location.search);
  const defaultSort =
    isoData?.site_res?.my_user?.local_user_view?.local_user?.default_sort_type ?? 'Active';
  const defaultListing =
    isoData?.site_res?.my_user?.local_user_view?.local_user?.default_listing_type ?? 'Local';

  return {
    sort: queryParams.get('sort') ?? defaultSort,
    listing: queryParams.get('listingType') ?? defaultListing,
  };
}

function showEndMessage() {
  let paginator = document.querySelector('.paginator');
  if (document.querySelector('.post-listing')) {
    paginator.innerHTML = 'There are no more posts!';
  } else {
    clearPaginator();
  }
}

function showSpinner() {
  let paginator = document.querySelector('.paginator');
  paginator.innerHTML =
    '<svg class="icon spin spinner-large"><use xlink:href="/static/9f75d0a/assets/symbols.svg#icon-spinner"></use><div class="visually-hidden"><title>spinner</title></div></svg>';
}

function clearPaginator() {
  let paginator = document.querySelector('.paginator');
  paginator.innerHTML = '';
}