// ==UserScript==
// @name        8chan (You) Notification Add-on
// @match       https://8chan.se/*/res/*
// @match       https://8chan.cc/*/res/*
// @match       https://8chan.moe/*/res/*
// @version     1.2
// @grant       GM_notification
// ==/UserScript==

(async () => {

    function main() {
      document.getElementById("requestBtn").remove()
      const board = location.pathname.match(/^\/?(.+\/)/)[1][0]
      const thread = document.getElementById("divThreads");
      const obs = new MutationObserver((mutationList) => {
        for (const mutation of mutationList) {
          for (const node of mutation.addedNodes) {
            if (node.tagName === "DIV" && node.classList.contains("postCell")) {
              checkForYous(node)
            }
          }
        }
      });
      obs.observe(thread, { childList: true, subtree: true });

      for (const post of thread.querySelectorAll(".postCell")) {
        checkForYous(post);
      }

      function checkForYous(post) {
        var myPosts = JSON.parse(localStorage.getItem(board + "-yous") || "[]")
        var readPosts = JSON.parse(localStorage.getItem("notifReadPosts") || "{}")
        if (!readPosts[board]) readPosts[board] = []
        if (readPosts[board].length > 200) readPosts[board] = readPosts[board].slice(Math.max(readPosts[board].length - 175, 0))
        myPosts.forEach(a=>{
          let quote = ">>" + a
          let postMessage = post.querySelector(".divMessage").textContent
          let postId = post.id
          if (postMessage.includes(quote)) {
            if (!readPosts[board].includes(postId)) {
              let notification = new Notification( "(You)" , { body: postMessage.replace( quote , "") });
              notification.onclick = function () {
                  document.getElementById(postId).scrollIntoView()
              };
              document.addEventListener("visibilitychange", () => {
                if (document.visibilityState === "visible") {
                  if (notification) notification.close();
                }
              });
              readPosts[board].push(postId)
              localStorage.setItem("notifReadPosts", JSON.stringify(readPosts))
            }
          }
        })
      }
    }

    async function requestNotifPerm(){
      if (Notification.permission != "granted") {
        let perm = await Notification.requestPermission()
        if (perm == "granted") {
          main()
        }
        else if (perm == "denied") {
          document.getElementById("requestBtn").textContent = "Unblock notifications to try again."
        }
      }
      else {
        main()
      }
    }

    let requestBtn = document.createElement("button")
    requestBtn.textContent = "Get (You) Notifications"
    requestBtn.id = "requestBtn"
    requestBtn.onclick = requestNotifPerm
    requestBtn.style.position = "fixed"
    requestBtn.style.top = "30px"
    requestBtn.style.right = "30px"
    document.body.appendChild(requestBtn)

    requestNotifPerm()

})();