ReaderBar.auto.min.js

function getCommonAncestor(e){if(arguments.length<2)throw new Error("getCommonAncestor: not enough parameters");let t,n="contains"in e?"contains":"compareDocumentPosition",o="contains"===n?1:16,i=[].slice.call(arguments,1);e:for(;e=e.parentNode;){for(t=i.length;t--;)if((e[n](i[t])&o)!==o)continue e;return e}return null}const barId="readerHelper",barProgressId="readerHelperBar",documentTitle=document.title;let contentNode;const getHighlightedElements=()=>Mine.qsaa("hypothesis-highlight"),getReadPercentage=()=>{const e=getHighlightedElements();if(e.length<2){const e=Mine.qs(`#${barId}`);return e&&(e.parentNode.removeChild(e),document.title=documentTitle),0}contentNode=getCommonAncestor(...e);const t="readerDone";contentNode.classList.contains(t)||(Mine.qsaa(`.${t}`).forEach((e=>e.classList.remove(t))),contentNode.classList.add(t));const n=(contentNode.offsetTop+contentNode.offsetHeight-window.scrollY)/contentNode.offsetHeight*100;return Math.min(Math.floor(n),100)},init=()=>{window.addEventListener("scroll",Mine.throttle((()=>{r();const e=Mine.qs("#ReaderBarPreview");e&&"block"===e.style.display&&n()}),50));const e=new Date;r();const t=e=>{(()=>{if(!Mine.qs("#ReaderBarPreview")){const e=document.createElement("div");e.innerHTML="<div id='ReaderBarPreview'><canvas id='ReaderBarCanvas' width='100'></canvas></div>",document.body.appendChild(e)}const e=Mine.qs("#ReaderBarPreview");e.onmouseover=()=>e.style.display="none";const t=contentNode.getBoundingClientRect();e.style.left=`${t.x}px`,e.style.width=`${t.width}px`})();const t=document.getElementById("ReaderBarCanvas"),n=t.getContext("2d");let o,i;Mine.qs("#ReaderBarPreview").style.display="block",(e=>{const{width:n,height:r}=e;o=t.width/n,i=e,t.width=""+n*o,t.height=""+r*o})(e.container),e.children.forEach((({e,rects:t})=>{const{x:r,y:d,width:s,height:a}=t;n.fillStyle=e.style.backgroundColor||"pink",n.fillRect((r-i.x)*o,(d-i.y)*o,s*o,a*o)})),(()=>{const e=-1*contentNode.getBoundingClientRect().y;n.strokeStyle="offwhite",n.lineWidth=1,n.strokeRect(0,e*o,t.width,window.innerHeight*o)})()};function n(){const e={container:Mine.qs(".readerDone").getBoundingClientRect(),children:getHighlightedElements().map((e=>({e,rects:e.getBoundingClientRect()})))};t(e)}const o=e=>n();let i=!1;function r(){const t=getReadPercentage();t&&((()=>{if(!Mine.qs(`#${barId}`)){const e=document.createElement("div");e.id=barId,e.innerHTML=`<div id="${barProgressId}" data-content=""></div>`,Mine.isi(`\n#${barId} {\n  cursor: pointer;\n  overflow: hidden;\n  position: fixed;\n  height: 14px;\n  bottom: 5px;\n  width: 50%;\n  background: RGB(230,230,230);\n  z-index: 100;\n  left: 25%;\n  border-radius: 5px;\n}\n#${barProgressId} {\n  background: lightblue;\n  width: 0;\n  height: 100%;\n  border-radius: 5px;\n  transition: width 1s ease 0s;\n}\ndiv#readerHelperBar::after {\n  content: attr(data-content);\n  font-size: 10px;\n  float: right;\n  width: 80px;\n  right: -90px;\n  top: 2px;\n  color: RGB(150, 150, 150);\n  position: relative;\n  line-height: 1;\n}\n.readerDone {\n  border-bottom: 15px silver solid;\n  border-radius: 0 0 10px 10px;\n  padding-bottom: 10px;\n  margin-bottom: 400px;\n  transition: all 1s ease 0s;\n}\n#ReaderBarPreview {\n  position: fixed;\n  bottom: 25px;\n  text-align: center;\n  display: none;\n  z-index: 100;\n}\n\n#ReaderBarCanvas {\n  border: 3px solid black;\n  border-radius: 5px;\n  background: white;\n  max-height: 400px;\n}`),document.body.appendChild(e);const t=()=>{const e=getHighlightedElements();if(e){const t=e.reverse()[0];window.scrollTo({top:window.scrollY+t.getBoundingClientRect().y-500,left:0,behavior:"smooth"})}},n=e=>{const t=Mine.qs("#ReaderBarPreview");t&&(t.style.display="none")},i=Mine.qs(`#${barId}`);i.onclick=t,i.onmouseover=o,i.onmouseout=n}})(),t<=0&&(i||(n(),i=!0)),(n=>{const o=()=>(new Date-e)/6e4,i=n<=0,r=Mine.qs(`#${barProgressId}`);r.style.width=`${n}%`,r.setAttribute("data-content",i?`✔️ ${Math.ceil(o())}m read`:`${t}% • ${(()=>{const e=o(),t=Math.ceil(e/(1-n/100)-e),i=t%60,r=(t-i)/60;return`${r?r+"h":""}${i}m`})()} left`);const d=Mine.qs(`#${barId}`),s=contentNode.getBoundingClientRect();d.style.left=`${s.x+100}px`,d.style.width=s.width-200+"px",document.title=`${n}% left • ${documentTitle}`})(t>=0?t:0))}};setTimeout(init,1e3);