@fusioncharts/fusiontime/src/_internal/components/brush/label.js

FusionCharts JavaScript time-series charting framework

"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule=true;exports.default=void 0;var _inheritsLoose2=_interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _componentInterface=require("@fusioncharts/core/src/component-interface");var _lib=require("@fusioncharts/core/src/lib");var _localizeDateString=require("../../_utils/localizeDateString");var START="start",END="end",SCALE="scale",DRAGSTART="timeNavBrushStart",DRAGEND="timeNavBrushEnd",DRAG="timeNavBrush",UP="up",DOWN="down",LABELFORMAT="%b %d, %Y";var Label=function(_SmartRenderer){function Label(){var _this;_this=_SmartRenderer.call(this)||this;_this._dimensions={};return _this}(0,_inheritsLoose2.default)(Label,_SmartRenderer);var _proto=Label.prototype;_proto.configureAttributes=function configureAttributes(obj){if(obj===void 0){obj={}}_SmartRenderer.prototype.configureAttributes.call(this,obj);var labelConfig=this.config,baseTextStyle=this.getFromEnv("baseTextStyle");for(var key in obj){if(obj.hasOwnProperty(key)){labelConfig[key]=obj[key]}}labelConfig.style={label:Object.assign({},labelConfig._defaultLabelStyle,baseTextStyle,labelConfig.style.label),labelBg:Object.assign({},labelConfig._defaultLabelBgStyle,labelConfig.style.labelBg)}};_proto.__setDefaultConfig=function __setDefaultConfig(){_SmartRenderer.prototype.__setDefaultConfig.call(this);var labelConfig=this.config;labelConfig.showLabel=false;labelConfig._defaultLabelStyle={fill:"#f3f3f3","font-size":"11px","font-weight":600,"vertical-align":"middle",cursor:"move"};labelConfig._defaultLabelBgStyle={fill:"#5f5f5f",cursor:"move"};labelConfig["border-horizontal-padding"]=5;labelConfig["border-vertical-padding"]=3};_proto.setDimension=function setDimension(dim){this._dimensions=dim};_proto.getDimension=function getDimension(){return this._dimensions};_proto.attachHandlers=function attachHandlers(){var label=this,animationManager=label.getFromEnv("animationManager"),brush=label.getLinkedParent(),timeNav=brush.getFromEnv("timeNavigator"),timeNavConfig=timeNav.config,chart=timeNav.getFromEnv("chart"),currFocusLimit,brushDim,dragLabelElem,clampDirection,startX,lastX,offsetX,startPx,endPx,options={timeFormatter:timeNavConfig.formatter},forceFireOptions=Object.assign({forceFire:true},options),eventArgs={formatter:LABELFORMAT,action:SCALE};label.addEventListener("fc-dragstart",label.dragstartHandler||(label.dragstartHandler=function(e){startX=(0,_lib.getTouchEvent)(e).clientX;lastX=0;brushDim=brush.getCurrentBrushDimensions();timeNav.config.labelsGettingDragged=true;dragLabelElem=e.originalEvent.target;brush.config.pointerReleasedOnParent=false;currFocusLimit=chart.getFocusLimit();chart.getFromEnv("fireChartEvents")(DRAGSTART,[+currFocusLimit[0],+currFocusLimit[1]],eventArgs,forceFireOptions)}));label.addEventListener("fc-dragmove",label.dragmoveHandler||(label.dragmoveHandler=function(e){animationManager.setAnimationState("timenavSqueeze");offsetX=(0,_lib.getTouchEvent)(e).clientX-startX;clampDirection=offsetX>=lastX?UP:DOWN;lastX=offsetX;if(label.config.type==="leftLabel"){startPx=brushDim.x+offsetX;endPx=brushDim.x+brushDim.width}else{startPx=brushDim.x;endPx=brushDim.x+brushDim.width+offsetX}timeNav.validateDomain([startPx,endPx],[clampDirection,clampDirection],{eventName:DRAG,eventArgs:eventArgs,options:options})}));label.addEventListener("fc-dragend",label.dragendHandler||(label.dragendHandler=function(e){animationManager.setAnimationState("timenavSqueeze");timeNav.config.labelsGettingDragged=false;if(dragLabelElem!==e.originalEvent.target){brush.hideAllLabels()}currFocusLimit=chart.getFocusLimit();chart.getFromEnv("fireChartEvents")(DRAGEND,[+currFocusLimit[0],+currFocusLimit[1]],eventArgs,forceFireOptions)}))};_proto.setValue=function setValue(value){this.config.value=value};_proto.getValue=function getValue(){return this.config.value};_proto.getLabelDimension=function getLabelDimension(){var label=this,labelConfig=label.config,smartLabel=label.getFromEnv("smartLabel"),formatter=label.getFromEnv("timeNavigatorConfig").formatter;smartLabel.setStyle(labelConfig.style.label);return smartLabel.getOriSize(formatter.format(labelConfig.value))};_proto.draw=function draw(){var _this$getFromEnv;var lang=(_this$getFromEnv=this.getFromEnv("language"))!=null?_this$getFromEnv:"english",label=this,config=label.config,labelStyle=config.style.label,labelBgStyle=config.style.labelBg,brush=label.getLinkedParent(),timeNavConfig=label.getFromEnv("timeNavigatorConfig"),smartLabel=label.getFromEnv("smartLabel"),brushMaxDim=brush.getMaxBrushDimensions(),labelDimensions=label.getDimension(),startX=labelDimensions.x,inverter,textAnchor,formatter=timeNavConfig.formatter,smartText,timeStamp=label.getValue(),text=formatter.format(timeStamp),startY=labelDimensions.y,labelStartX,labelStartY,labelWidth,labelHeight,labelBgWidth,labelBgHeight;text=(0,_localizeDateString.localizeDateString)(text,lang);smartLabel.setStyle(labelStyle);smartText=smartLabel.getOriSize(text);if(config.type==="leftLabel"){if(startX-smartText.width>=brushMaxDim.x){textAnchor=END;inverter=1}else{textAnchor=START;inverter=-1}}else{if(startX+smartText.width<=brushMaxDim.x+brushMaxDim.width){textAnchor=START;inverter=-1}else{textAnchor=END;inverter=1}}labelStyle["text-anchor"]=textAnchor;if(config.showLabel){labelWidth=smartText.width;labelHeight=smartText.height;labelBgWidth=labelWidth+2*config["border-horizontal-padding"];labelBgHeight=labelHeight+2*config["border-vertical-padding"];labelStartX=startX-inverter*config["border-horizontal-padding"];labelStartY=startY-(labelHeight+2*config["border-vertical-padding"])/2;label.addGraphicalElement({el:"rect",attr:{x:textAnchor===START?startX:startX-labelBgWidth,y:startY-labelBgHeight,width:labelBgWidth,height:labelBgHeight},css:labelBgStyle,shadow:[true,1],label:"dragableLabelBackground",id:config.type+"dragableLabelBackground",component:label,container:{id:"brushGroup",label:"brushGroup",isParent:true}});label.addGraphicalElement({el:"text",attr:{x:labelStartX,y:labelStartY,text:text},css:labelStyle,id:config.type+"dragableLabel",label:"dragableLabel",component:label,container:{id:"brushGroup",label:"brushGroup",isParent:true}})}};return Label}(_componentInterface.SmartRenderer);var _default=exports.default=Label;