niconizer
Version:
A desktop application that displays plain text, images, or any other HTML content on the screen, like nicovideo or bilibili.
1 lines • 1.29 kB
JavaScript
let emit=useContainer();function useContainer(){let e=document.querySelector(".comment-container")??throws(Error("Comment container not found"));return e.addEventListener("transitionend",({target:e})=>{e instanceof Element&&e.remove()}),emitContent.bind(void 0,e)}function getLineHeight(e){let t=document.createElement("div");t.className="comment",t.style.visibility="hidden",t.textContent="M",e.append(t);let{offsetHeight:n}=t;return t.remove(),n}function emitContent(e,t){let n=getLineHeight(e),i=document.createElement("div");i.className="comment flip-enter-to",i.innerHTML=t,e.append(i);let{classList:o,style:r,dataset:l,offsetWidth:a,offsetHeight:c,offsetLeft:s}=i;o.remove("flip-enter-to");let{offsetLeft:d}=i;o.add("flip-enter-active"),r.transform=`translateX(${s-d}px)`;let m=0,f=0;for(;;){for(;;){let t=[...e.querySelectorAll(`[data-layer="${m}"][data-line="${f}"]`)].at(-1);if(!t)break;if(checkCollision(t,a)){f++;continue}break}if(!f||n*f+c<=innerHeight)break;m++,f=0}l.line=`${f}`,l.layer=`${m}`,r.setProperty("--line",`${f}`),r.setProperty("--layer",`${m}`)}function checkCollision(e,t){let n=e.getBoundingClientRect();return innerWidth<n.right||innerWidth-n.left<t}function throws(e){throw e}new WebSocket("ws://localhost:25252/").addEventListener("message",e=>{emit(e.data)});