Show HN: Display a bell emoji on HN comments you haven't read yet(gist.github.com)

  a:link{
    color: orange !important;
  }
  
  /* visited link */
  a:visited {
    color: green !important;
  }

    span.style.cssText = `
      font-size: 5px;
      color: transparent;
      text-shadow: 0 0 0 gray;
      margin-bottom: 2px;
      vertical-align: middle;
      display: inline-block;
    `

  const div = document.createElement("div");
  div.innerHTML = `<div style="position:fixed;top:20px;right:20px;width:40px;background:#ff05;">
     <input type="range" orient="vertical" id="interval" min="0" max="95" value="30" style="width:100%">
     <label for="interval" style="display:block"></label>
  </div>`;
  const input = div.firstElementChild.firstElementChild;
  const label = input.nextElementSibling;
  document.body.appendChild(div);
  const formatTime = (mins) => {
    if (mins > 60) {
      return `${Math.floor(mins / 60)}h ${mins % 60}m`;
    }
    return `${mins}m`;
  };
  const extrapolate = (val) => {
    val = val * 2;
    for (let t = 30; t <= 150; t += 30) {
      val += Math.max(0, val - t);
    }
    return val;
  };
  input.oninput = () => colorStuff(extrapolate(input.value));
  const colorStuff = (interval_minutes) => {
    label.innerText = `${formatTime(interval_minutes)}`;
    const comments = Array.from(document.getElementsByClassName("athing comtr"));
    dates = Array.from(document.getElementsByClassName('age'));
    dates.sort((c1, c2) => Date.parse((c2).title) - Date.parse((c1).title));
    const now = new Date();
    const timestamp = now.getTime() + now.getTimezoneOffset() * 60E3;
    comments.forEach((c) => {
      const commentDateString = c.getElementsByClassName("age")[0].title;
      const diff=(timestamp-Date.parse(c.getElementsByClassName('age')[0].title))/60E3;
      const diff2=(Date.parse(dates[0].title)-Date.parse(c.getElementsByClassName('age')[0].title))/60E3;
      if (diff < interval_minutes) {
        const alpha = (1 - diff2 / interval_minutes)**6;
        c.style.backgroundColor = `rgba(100, 255, 100, ${alpha})`;
      } else {
         c.style.backgroundColor = "rgba(255, 255, 255,0)";
      }
    });
  };
  colorStuff(extrapolate(input.value));

    function checkquota(){
      // localStorage limit is ~5MB, should probably do something about exceeding quota ;)
      // lets trigger around 3MB
      // deleting half of the oldest empty(seen, never interacted with) entries first
      // popping a warning when we finally reach over 2MB non empty
      //
      // total entries: localStorage.length
      // storage bytes left: 1024 * 1024 * 5 - escape(encodeURIComponent(JSON.stringify(localStorage))).length
      // non empty entries: Object.entries(localStorage).filter(value => value[1] != "1")
      // non empty entries size: escape(encodeURIComponent(JSON.stringify(Object.entries(localStorage).filter(value => value[1] != "1")))).length
      // empty entries sorted, oldest first Object.entries(localStorage).filter(value => value[1] == "1").sort(function (a, b) {return parseInt(a[0]) - parseInt(b[0]);});
    
      //size check is expensive, can be as long as 500ms for full localstorage, limit size checks to ~once per 24h
      if (GM_getValue("lastquotacheck") > Date.now()) return;
      GM_setValue("lastquotacheck", Date.now()+86400000);
    
      let size = encodeURIComponent(JSON.stringify(localStorage)).length;
      console.log("Current size: "+size+" bytes");
      if (size > 1024 * 1024 * 3)
      {
        alert("Current hackahackernews consumed localStorage size: "+size+" bytes, cleaning older entries to make more room.");
        let sortedStorage = Object.entries(localStorage).filter(value => value[1] == "1").sort(function (a, b) {return parseInt(a[0]) - parseInt(b[0]);});
        let cutout = parseInt(sortedStorage.length/2);
        for (let [index, value] of sortedStorage.entries())
        {
          if (index < cutout)
          {
            localStorage.removeItem(value[0]);
          }
        }
        size = encodeURIComponent(JSON.stringify(localStorage)).length;
        console.log("Size after culling empty entries: "+size+" bytes");
        let nonempty = Object.entries(localStorage).filter(value => value[1] != "1");
        if (encodeURIComponent(JSON.stringify(nonempty)).length > 1024 * 1024 * 2)
        {
          console.log("Non empty entries size is over 2MB! currently at: "+encodeURIComponent(JSON.stringify(nonempty)).length+" bytes.");
          if (confirm("Saved visited links are consuming "+encodeURIComponent(JSON.stringify(nonempty)).length+" bytes, delete half of the oldest entries?"))
          {
            let sortedNonempty = nonempty.sort(function (a, b) {return parseInt(a[0]) - parseInt(b[0]);});
            let cutout = parseInt(sortedNonempty.length/2);
            for (let [index, value] of sortedNonempty.entries())
            {
              if (index < cutout)
              {
                localStorage.removeItem(value[0]);
              }
            }
    
          }
        }
        size = encodeURIComponent(JSON.stringify(localStorage)).length;
        console.log("Final size after culling: "+size+" bytes");
      }
    }