@fusioncharts/fusiontime/src/_internal/components/tooltip-and-hover.js

FusionCharts JavaScript time-series charting framework

"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule=true;exports.default=exports.createDivString=void 0;var _inheritsLoose2=_interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _smartRenderer=_interopRequireDefault(require("@fusioncharts/core/src/component-interface/smart-renderer"));var MOUSEOVER="fc-mouseover",MOUSEDOWN="fc-mousedown",MOUSEUP="fc-mouseup",MOUSEMOVE="fc-mousemove",MOUSEOUT="fc-mouseout",CLICK="fc-click",xShift=5,BLANK="",getCSPNonce=function getCSPNonce(){var metaTag=document.querySelector('meta[http-equiv="Content-Security-Policy"]');if(metaTag){var content=metaTag.getAttribute("content");if(content){var match=content.match(/'nonce-([^']+)'/);if(match){return match[1]}}}return null},createDivString=exports.createDivString=function createDivString(styleStr,string){if(styleStr===void 0){styleStr=""}if(string===void 0){string=""}var styleString=styleStr.replaceAll("style","").replaceAll("'","").replaceAll("=",""),className="styleStrClass-"+Math.random().toString(36).substring(2),chartNonce=getCSPNonce(),styles='\n      <style nonce="'+chartNonce+'">\n        .'+className+" {\n          "+styleString+"\n        }\n      </style>\n    ";return styles+'<div class="'+className+'">'+string+"</div>"};var UNDEF;var MouseAction=function(_SmartRenderer){function MouseAction(){return _SmartRenderer.apply(this,arguments)||this}(0,_inheritsLoose2.default)(MouseAction,_SmartRenderer);var _proto=MouseAction.prototype;_proto.configure=function configure(){_SmartRenderer.prototype.configure.call(this);var mouseAction=this,config=mouseAction.config,chartConfig=mouseAction.getFromEnv("chartConfig"),mouseTracker=mouseAction.getFromEnv("mouseTracker");config.showTooltip=chartConfig.showTooltip;!config.eventAdded&&mouseAction.addExtEventListener("canvasHovered",function(_mouseAction){config.eventAdded=true;return function(){switch(arguments[1].hoveredInfo&&arguments[1].hoveredInfo.component&&arguments[1].hoveredInfo.component.getType()){case"timeMarker":if(arguments[1].e.type===MOUSEOVER){_mouseAction._triggerMouseActions({data:{hoveredInfo:{},e:{}}})}_mouseAction._triggerMarkerMouseActions.apply(_mouseAction,arguments);break;default:_mouseAction._triggerMouseActions.apply(_mouseAction,arguments)}}}(mouseAction),mouseTracker)};_proto.mouseoutHandler=function mouseoutHandler(e,_lastDatasetIndex,_lastPointIndex,lastComponentHovered){var mouseAction=this,config=mouseAction.config;if(lastComponentHovered&&lastComponentHovered.config){lastComponentHovered.setHoverOutEffect([_lastPointIndex]);lastComponentHovered._firePlotEvent&&lastComponentHovered._firePlotEvent(MOUSEOUT,_lastPointIndex,e)}config.showTooltip&&mouseAction.getFromEnv("toolTipController").hide(config.currentToolTip);delete config._lastDatasetIndex;delete config._lastPointIndex};_proto._triggerMarkerMouseActions=function _triggerMarkerMouseActions(customObj){var mouseAction=this,data=customObj.data,e=data.e,toolTipController=mouseAction.getFromEnv("toolTipController"),tooltipStyle=mouseAction.getFromEnv("tooltipStyle"),chartX=data.chartX,chartY=data.chartY,parent=mouseAction.getLinkedParent(),startX,startY,translation=parent.getTranslation(),hoveredInfo=data.hoveredInfo,hovered=hoveredInfo.hovered,derivedEvents,config=mouseAction.config,showToolip=config.showTooltip,timeMarker=hoveredInfo.component,hoveredMarkerDim=hoveredInfo.pointObj.hoveredMarkerDim||{},toolText=BLANK,tooltextConfig=hoveredInfo.hovered&&timeMarker.getToolTextConfiguration(hoveredMarkerDim.toolTextArr,hoveredInfo.pointObj.type),isWithinCanvas=parent.isWithinCanvas(chartX-(hoveredMarkerDim.thresholdX||0),chartY-(hoveredMarkerDim.thresholdY||0)),i,l;if(hovered&&isWithinCanvas){var header=tooltextConfig.header,body=tooltextConfig.body;toolText=createDivString(tooltipStyle.headerStyleString,header)+createDivString(tooltipStyle.bodyStyleString,body);startX=chartX;startY=hoveredMarkerDim.y-tooltextConfig.dimensions.height+translation.y;showToolip&&(config.currentToolTip=toolTipController.drawAt(startX,startY,toolText,config.currentToolTip,parent));timeMarker.setHoverInEffect(hoveredInfo.pointIndex,hoveredInfo.pointObj.index,false);derivedEvents=mouseAction.getMakerMouseEvents(e,hoveredInfo.pointIndex,hoveredInfo.pointObj.index);if(l=derivedEvents.length){config._lastMarkerIndex=hoveredInfo.pointIndex;config._lastDomainIndex=hoveredInfo.pointObj.index;for(i=0;i<l;i++){timeMarker.fireMarkerEvents(derivedEvents[i],hoveredInfo.pointIndex,hoveredInfo.pointObj.index)}}}else{showToolip&&toolTipController.hide(config.currentToolTip);timeMarker.setHoverOutEffect();if(config._lastMarkerIndex!==UNDEF&&config._lastDomainIndex!==UNDEF){timeMarker.fireMarkerEvents(MOUSEOUT,hoveredInfo.pointIndex,hoveredInfo.pointObj.index)}config._lastMarkerIndex=UNDEF;config._lastDomainIndex=UNDEF}};_proto._triggerMouseActions=function _triggerMouseActions(customObj){var mouseAction=this,data=customObj.data,toolTipController=mouseAction.getFromEnv("toolTipController"),tooltipStyle=mouseAction.getFromEnv("tooltipStyle"),dataSource=mouseAction.getFromEnv("dataSource"),customToolText=dataSource.tooltip?dataSource.tooltip.tooltext:null,componentIndex=data.i,e=data.e,chartX=data.chartX,chartY=data.chartY,hoveredInfo=data.hoveredInfo,pointObj,pointFound=componentIndex>=0,parent=mouseAction.getLinkedParent(),datasets=parent.getChild(UNDEF,"dataset"),config=mouseAction.config,_lastDatasetIndex=config._lastDatasetIndex,_lastPointIndex=config._lastPointIndex,translation=parent.getTranslation(),l,j,header=BLANK,body=BLANK,tooltext=BLANK,currTooltext,validPointObj,xRange,currPointIndex=hoveredInfo&&hoveredInfo.pointIndex,targetComponent,datasetToEnquire,currDsConfig,isWithinCanvas=parent.isWithinCanvas(chartX,chartY),derivedEvensInfo;if(!hoveredInfo){return}if(pointFound){hoveredInfo.datasetIndex=componentIndex;derivedEvensInfo=mouseAction.getMouseEvents(e,hoveredInfo.datasetIndex,currPointIndex,hoveredInfo.component.getName(),hoveredInfo.markerObj)}if(!isWithinCanvas||(!pointFound||derivedEvensInfo&&derivedEvensInfo.fireOut)&&typeof _lastDatasetIndex!=="undefined"){if(derivedEvensInfo&&!derivedEvensInfo.events.length){config.mouseoutTimer=setTimeout((function(){mouseAction.mouseoutHandler(e,_lastDatasetIndex,_lastPointIndex,config._lastComponentHovered)}),20)}else{mouseAction.mouseoutHandler(e,_lastDatasetIndex,_lastPointIndex,config._lastComponentHovered);clearTimeout(config.mouseoutTimer)}}if(isWithinCanvas&&datasets.length&&config.showTooltip){xRange=hoveredInfo.component.getFromEnv("xScale").getRange();datasets.forEach((function(dataset,index){currDsConfig=dataset.config;if(currDsConfig.visibility==="visible"){currTooltext=dataset._getTooltext(pointFound,componentIndex===index,dataset._getHoveredBin());if(customToolText){tooltext=currTooltext}else{tooltext+=currTooltext}if(currDsConfig.dataInfo[dataset._getHoveredBin()]&&currTooltext){validPointObj=currDsConfig.dataInfo[dataset._getHoveredBin()];datasetToEnquire=dataset}}}));if(datasetToEnquire){var _datasetToEnquire$_ge=datasetToEnquire._getDateForToolText(datasetToEnquire._getHoveredBin());header=_datasetToEnquire$_ge.header;body=_datasetToEnquire$_ge.body}if(customToolText){tooltext=createDivString("",body+tooltext)}else{tooltext=createDivString(tooltipStyle.headerStyleString,header)+createDivString(tooltipStyle.bodyStyleString,body+tooltext)}pointObj=pointFound?hoveredInfo.pointObj:validPointObj;if(pointObj){tooltext!==""&&pointObj.endXPosition>xRange[0]&&pointObj.x<xRange[1]?config.currentToolTip=toolTipController.drawAt(pointObj.x+(pointObj.width||0)/2+xShift+translation.x,(pointObj.colY||pointObj.y)+translation.y,tooltext,config.currentToolTip,parent):toolTipController.hide(config.currentToolTip)}else{toolTipController.hide(config.currentToolTip)}}if(pointFound){l=derivedEvensInfo.events&&derivedEvensInfo.events.length;if(l){config._lastDatasetIndex=hoveredInfo.datasetIndex;config._lastPointIndex=currPointIndex;targetComponent=config._lastComponentHovered=hoveredInfo.component;config._lastComponentHoveredName=targetComponent&&targetComponent.getName();targetComponent.setHoverInEffect([currPointIndex]);if(config.showTooltip&&targetComponent.getType()==="dataMarker"){var _targetComponent$_get=targetComponent._getTooltext(currPointIndex);header=_targetComponent$_get.header;body=_targetComponent$_get.body;tooltext=createDivString(tooltipStyle.headerStyleString,header)+createDivString(tooltipStyle.bodyStyleString,body);config.currentToolTip=toolTipController.draw(e,tooltext,config.currentToolTip)}for(j=0;j<l;j+=1){if(targetComponent&&targetComponent._firePlotEvent){targetComponent&&targetComponent._firePlotEvent&&targetComponent._firePlotEvent(derivedEvensInfo.events[j],currPointIndex,e)}}}}};_proto.getMouseEvents=function getMouseEvents(e,datasetIndex,plotIndex,componentName){var mouseAction=this,config=mouseAction.config,lastDatasetIndex=config._lastDatasetIndex,lastPointIndex=config._lastPointIndex,lastComponentHovered=config._lastComponentHoveredName,eventType=e.type,derivedEvensInfo={fireOut:false,events:[]};switch(eventType){case CLICK:derivedEvensInfo.events.push(CLICK);break;case MOUSEMOVE:if(lastComponentHovered===componentName&&lastDatasetIndex===datasetIndex&&lastPointIndex===plotIndex){clearTimeout(config.mouseoutTimer);derivedEvensInfo.events.push(MOUSEMOVE)}else{derivedEvensInfo.events.push(MOUSEOVER);derivedEvensInfo.fireOut=true}break;case MOUSEDOWN:if(lastComponentHovered!==componentName||lastDatasetIndex!==datasetIndex||lastPointIndex!==plotIndex){derivedEvensInfo.fireOut=true;derivedEvensInfo.events.push(MOUSEOVER)}derivedEvensInfo.events.push(MOUSEDOWN);break;case MOUSEOVER:if(lastComponentHovered===componentName&&lastDatasetIndex===datasetIndex&&lastPointIndex===plotIndex){clearTimeout(config.mouseoutTimer)}else{derivedEvensInfo.fireOut=true;derivedEvensInfo.events.push(MOUSEOVER)}break;case MOUSEUP:derivedEvensInfo.events.push(MOUSEUP);break;case MOUSEOUT:derivedEvensInfo.fireOut=true}return derivedEvensInfo};_proto.getMakerMouseEvents=function getMakerMouseEvents(e,markerIndex,domainIndex){var mouseAction=this,config=mouseAction.config,lastMarkerIndex=config._lastMarkerIndex,lastDomainIndex=config._lastDomainIndex,eventType=e.type,derivedEvents=[];switch(eventType){case CLICK:derivedEvents.push(CLICK);break;case MOUSEMOVE:if(lastMarkerIndex===markerIndex&&lastDomainIndex===domainIndex){derivedEvents.push(MOUSEMOVE)}else{derivedEvents.push(MOUSEOVER)}break;case MOUSEOVER:if(lastMarkerIndex!==markerIndex&&lastDomainIndex!==domainIndex){derivedEvents.push(MOUSEOVER)}break}return derivedEvents};return MouseAction}(_smartRenderer.default);var _default=exports.default=MouseAction;