jspanel4
Version:
A JavaScript library to create highly configurable multifunctional floating panels that can also be used as modal, tooltip, hint or contextmenu
1 lines • 5.79 kB
JavaScript
;function _defineProperty(t,e,o){return e in t?Object.defineProperty(t,e,{value:o,enumerable:!0,configurable:!0,writable:!0}):t[e]=o,t}!function(t){try{return new e("test"),!1}catch(t){}var e=function(e,o){o=o||{bubbles:!1,cancelable:!1};var n=document.createEvent("MouseEvent");return n.initMouseEvent(e,o.bubbles,o.cancelable,t,0,0,0,0,0,!1,!1,!1,!1,0,null),n};e.prototype=Event.prototype,t.MouseEvent=e}(window),jsPanel.tooltip||(jsPanel.tooltip={version:"1.4.0",date:"2021-03-13 11:20",defaults:{border:"1px",dragit:!1,resizeit:!1,headerControls:"none",delay:400,ttipEvent:"mouseenter",ttipName:"default",parentPanelFront:!1},create:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},e=arguments.length>1?arguments[1]:void 0;t.paneltype="tooltip",t.id?"function"==typeof t.id&&(t.id=t.id()):t.id="jsPanel-".concat(jsPanel.idCounter+=1);var o,n=t.target,r=t.mode||"default";if("string"==typeof n&&(n=document.querySelector(n)),!n){try{throw new jsPanel.jsPanelError("TOOLTIP SETUP FAILED!<br>Either option target is missing in the tooltip configuration or the target does nor exist in the document!")}catch(t){jsPanel.error(t)}return!1}jsPanel.pointerdown.forEach(function(t){n.addEventListener(t,function(t){t.stopPropagation()},!1)});var i=t;if(t.config&&delete(i=Object.assign({},t.config,t)).config,(i=Object.assign({},jsPanel.tooltip.defaults,i)).position=Object.assign({},t.position),i.position.of=t.position.of||n,n[i.ttipName]=function(){o=window.setTimeout(function(){if(document.getElementById(t.id))return!1;jsPanel.create(i,function(t){var o=t,l=function e(){o.close(),n.removeEventListener("mouseleave",e),t.removeEventListener("mouseleave",e)};if("default"===r?n.addEventListener("mouseleave",l,!1):"semisticky"===r&&t.addEventListener("mouseleave",l,!1),t.classList.add("jsPanel-tooltip"),t.style.overflow="visible",t.header.style.cursor="default",t.footer.style.cursor="default",n.closest(".jsPanel-modal")?t.style.zIndex=n.closest(".jsPanel-modal").style.zIndex:(n.closest(".jsPanel")&&i.parentPanelFront&&n.closest(".jsPanel").front(),t.style.zIndex=jsPanel.zi.next()),jsPanel.pointerdown.forEach(function(e){t.addEventListener(e,function(t){t.stopPropagation()},!1)}),i.connector){var a=jsPanel.tooltip.relativeTipPos(t.options.position);"over"!==a&&t.append(jsPanel.tooltip.addConnector(t,a))}e&&e.call(t,t)})},i.delay)},n.addEventListener(i.ttipEvent,n[i.ttipName],!1),i.autoshow){var l=new MouseEvent("mouseenter");n.dispatchEvent(l)}n.addEventListener("mouseleave",function(){window.clearTimeout(o)},!1)},relativeTipPos:function(t){return"center-bottom"===t.my&&"center-top"===t.at?"top":"left-center"===t.my&&"right-center"===t.at?"right":"center-top"===t.my&&"center-bottom"===t.at?"bottom":"right-center"===t.my&&"left-center"===t.at?"left":"right-bottom"===t.my&&"left-top"===t.at?"left-top-corner":"left-bottom"===t.my&&"right-right"===t.at?"right-top-corner":"left-top"===t.my&&"right-bottom"===t.at?"right-bottom-corner":"right-top"===t.my&&"left-bottom"===t.at?"left-bottom-corner":"left-bottom"===t.my&&"left-top"===t.at?"topleft":"right-bottom"===t.my&&"right-top"===t.at?"topright":"left-top"===t.my&&"right-top"===t.at?"righttop":"left-bottom"===t.my&&"right-bottom"===t.at?"rightbottom":"right-top"===t.my&&"right-bottom"===t.at?"bottomright":"left-top"===t.my&&"left-bottom"===t.at?"bottomleft":"right-bottom"===t.my&&"left-bottom"===t.at?"leftbottom":"right-top"===t.my&&"left-top"===t.at?"lefttop":"over"},addConnector:function(t,e){var o,n,r,i,l=document.createElement("div");if(l.className="jsPanel-connector jsPanel-connector-".concat(e),"top"===e||"topleft"===e||"topright"===e?t.style.top="calc(".concat(t.style.top," - 12px)"):"right"===e||"righttop"===e||"rightbottom"===e?t.style.left="calc(".concat(t.style.left," + 12px)"):"bottom"===e||"bottomleft"===e||"bottomright"===e?t.style.top="calc(".concat(t.style.top," + 12px)"):"left"!==e&&"lefttop"!==e&&"leftbottom"!==e||(t.style.left="calc(".concat(t.style.left," - 12px)")),i="string"==typeof t.options.connector?t.options.connector:window.getComputedStyle(t).borderBottomColor,e.match(/-/))r={left:o,top:n,backgroundColor:i};else{var a=window.getComputedStyle(t);if("topleft"===e||"topright"===e){if("topleft"===e)o=a.borderBottomLeftRadius;else{var s=24+parseInt(a.borderBottomLeftRadius)+"px";o="calc(100% - ".concat(s,")")}e="top"}else if("bottomleft"===e||"bottomright"===e){if("bottomleft"===e)o=a.borderTopLeftRadius;else{var c=24+parseInt(a.borderTopRightRadius)+"px";o="calc(100% - ".concat(c,")")}e="bottom"}else if("lefttop"===e||"leftbottom"===e){if("lefttop"===e)n=a.borderTopRightRadius;else{var p=24+parseInt(a.borderBottomRightRadius)+"px";n="calc(100% - ".concat(p,")")}e="left"}else if("righttop"===e||"rightbottom"===e){if("righttop"===e)n=a.borderTopLeftRadius;else{var f=24+parseInt(a.borderBottomLeftRadius)+"px";n="calc(100% - ".concat(f,")")}e="right"}r=_defineProperty({left:o,top:n},"border-".concat(e,"-color"),i)}return jsPanel.setStyle(l,r),l},reposition:function(t,e,o){setTimeout(function(){if(e.of=t.options.position.of,t.reposition(e),t.options.connector){var n=t.querySelector("div.jsPanel-connector");t.removeChild(n);var r=jsPanel.tooltip.relativeTipPos(e);"over"!==r&&t.append(jsPanel.tooltip.addConnector(t,r))}return o&&o.call(t,t),t},200)},remove:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"mouseenter",o=t[arguments.length>2&&void 0!==arguments[2]?arguments[2]:"default"];t.removeEventListener(e,o)}},jsPanel.pointerdown.forEach(function(t){document.addEventListener(t,function(t){document.querySelectorAll(".jsPanel-tooltip").forEach(function(e){t.target.closest(".jsPanel-tooltip")||e.options.autoshow||e.close()})},!1)})),"undefined"!=typeof module&&(module.exports=jsPanel);