Tooltips.min.js

class TooltipHelper{constructor(a){a=a||{},this.settings={tooltipWidth:a.tooltipWidth||300,tooltipHTMLTag:a.tooltipHTMLTag||"custom-tooltip"},this.tooltipData={cache:new WeakMap,maxDepth:0,currentElem:null},this._createTooltipElement(),document.body.addEventListener("mousemove",a=>{this._getEventPath(a)[0]!==this.tooltipData.currentElem&&(this.tooltipData.maxDepth=0,this.tooltipData.currentElem=null,this.tooltipElement.style.opacity="0")})}setTooltip(a,b){const c=this.tooltipData.cache.has(a);this.tooltipData.cache.set(a,{text:b,mousemove:b=>{this._getEventPath(b).length>this.tooltipData.maxDepth&&(this.tooltipData.maxDepth=this._getEventPath(b).length,this.tooltipData.currentElem=a,this._makeTooltipVisible(a))},mouseleave:()=>{this.tooltipData.currentElem===a&&(this.tooltipData.maxDepth=0,this.tooltipData.currentElem=null),this.tooltipElement.style.opacity="0"}});c||(a.style.setProperty("pointer-events","auto","important"),a.addEventListener("mouseenter",this.tooltipData.cache.get(a).mousemove),a.addEventListener("mousemove",this.tooltipData.cache.get(a).mousemove),a.addEventListener("mouseleave",this.tooltipData.cache.get(a).mouseleave))}_makeTooltipVisible(a){this._doesTooltipExist()||this._createTooltipElement(),this.tooltipElement.innerText=this.tooltipData.cache.get(a).text,window.requestAnimationFrame(()=>{this.tooltipElement.style.opacity="1";const b=this.tooltipElement.getBoundingClientRect(),c=this._getAbsoluteBoundingRect(a);this.tooltipElement.style.top=0<c.top-b.height-15?c.top-b.height-15+"px":c.bottom+15+"px";let d=Math.round(c.left+c.width/2);document.documentElement.scrollWidth>this.settings.tooltipWidth&&(d+this.settings.tooltipWidth/2>document.documentElement.scrollWidth&&(d+=document.documentElement.scrollWidth-(d+this.settings.tooltipWidth/2)),0>d-this.settings.tooltipWidth/2&&(d+=0-(d-this.settings.tooltipWidth/2))),this.tooltipElement.style.left=d-this.settings.tooltipWidth/2+"px"})}getTooltip(a){const b=this.tooltipData.cache.get(a);return b?b.text:null}removeTooltip(a){this.tooltipData.cache.get(a)&&(a.removeEventListener("mouseenter",this.tooltipData.cache.get(a).mousemove),a.removeEventListener("mousemove",this.tooltipData.cache.get(a).mousemove),a.removeEventListener("mouseleave",this.tooltipData.cache.get(a).mouseleave),this.tooltipData.cache.delete(a))}_getAbsoluteBoundingRect(a){const b=a.getBoundingClientRect(),c=window.pageXOffset||document.documentElement.scrollLeft,d=window.pageYOffset||document.documentElement.scrollTop;return{width:b.width,height:b.height,top:b.top+d,right:b.right+c,bottom:b.bottom+d,left:b.left+c}}_getEventPath(a){let b=a.path||a.composedPath&&a.composedPath();if(!b){b=[];for(let c=a.target;c;){let a=null;if(c.parentNode)a=c.parentNode;else if(c.host)a=c.host;else if(c.defaultView)a=c.defaultView;else break;b.push(a),c=a}}return b}_doesTooltipExist(){return null!==this.tooltipElement.parentElement}_createTooltipElement(){const a=document.createElement(this.settings.tooltipHTMLTag);a.style.cssText=`background-color:rgba(17,17,17);border-radius:4px;color:#ffffff;font-size:13px;font-weight:normal;padding:0.5em 1em;box-sizing:border-box;z-index:99999999;font-family:monospace;position:absolute;pointer-events:none;text-align:left;white-space:pre-wrap;width:${this.settings.tooltipWidth}px;transform:translate3d(0,0,0);-webkit-backface-visibility:hidden;backface-visibility:hidden;opacity:0;box-shadow:#ffffff 0px 0px 5px 0px inset;`,document.body.appendChild(a),this.tooltipElement=a}}