quoslibero/vendors/fc-timeseries/src/_internal/components/time-navigator/index.js

FusionCharts JavaScript charting framework

import{SmartRenderer}from'../../../../../fc-core/src/component-interface';import Canvas from'../../components/canvas';import Line from'../../components/dataset/line';import timeNavigatorAxisFactory from'../../factories/time-navigator-axis';import scrollbarFactory from'../../factories/scrollbar-factory';import brushFactory from'../../factories/time-navigator-brush-factory';import{getDarkColor}from'../../../../../fc-core/src/lib';const DEFAULT_GRID_STYLE={stroke:'#F1F1F1',"stroke-width":'1',"stroke-opacity":'1'},timeNavCanvas=a=>{const b=a.config,c=b.xConfigs[0].style?b.xConfigs[0].style:{},d=Object.assign({},DEFAULT_GRID_STYLE,a.getFromEnv('getStyleDef')(c['grid-line']));a.attachChild(Canvas,'canvas').configure({xConfigs:b.xConfigs,yConfigs:b.yConfigs,plotConfigs:b.plotConfigs,tableMap:b.tableMap,enableGridLines:!0,gridLineDirection:'vertical',enableMarkers:!1,enableReferenceLine:!1,leftBorder:b.border.left,bottomBorder:b.border.bottom,topBorder:b.border.top,rightBorder:b.border.right,enableTimeMarkers:!1,styleGridLines:0,includeLegend:0,enableMouseTracking:0,isContext:!0,gridLineStyle:d})},extractScales=a=>a.scale,COLOR_E3E3E3='#e3e3e3',COLOR_F8F8F8='#f8f8f8';class TimeNavigator extends SmartRenderer{constructor(){super(),this._dimensions={},this._translation={},this._scrollbarConfig={},this.registerFactory('timeNavigatorAxis',timeNavigatorAxisFactory),this.registerFactory('scrollbar',scrollbarFactory),this.registerFactory('brush',brushFactory),this.registerFactory('canvas',timeNavCanvas)}__setDefaultConfig(a={}){super.__setDefaultConfig(a);let b=this.config;b.startX=0,b.startY=0,b.scrollbarHeight=18,b.scrollbarStart=-17.5,b.scrollbarButtonWidth=17,b.yScalePadding=20,b.border={left:1,right:1,top:1,bottom:0},b.defaultButtonStyle={fill:COLOR_E3E3E3},b.defaultTrackStyle={fill:COLOR_F8F8F8},b.defaultScrollBarStyle={fill:COLOR_E3E3E3}}setContextScale(){let a,b=this,c=b.config,d=b.getFromEnv('chart'),e=d.getContextLimit(),f=c.xConfigs.map(extractScales)[0];c.contextScale=a=f.copy(),a.minBin=f.minBin,a.setDomain([e[0],e[1]])}setDimension(a){let b=this,c=b.config,d=b.getChildren('canvas')[0],e=b.getChildren('brush')[0],f=c.border,g=e.getLabelSpace();b._dimensions.width=a.width,b._dimensions.height=a.height,d.setDimension({left:c.startX,top:g,width:this._dimensions.width,height:Math.max(this._dimensions.height-g-c.scrollbarHeight,0)}),b.getChildren('timeAxis').forEach(a=>{a.setTranslation(0,g),a.placeAxis()}),c.xConfigs.map(extractScales).forEach(a=>{a.setRange([f.left,this._dimensions.width-(f.left/2+f.right/2)])}),c.yConfigs.map(extractScales).forEach(a=>a.setRange([this._dimensions.height-c.scrollbarHeight-f.top-f.bottom,g])),b.setContextScale()}getPosition(){return{x:this.config._translateX,y:this.config._translateY}}setChildDimension(){let a=this,b=a.config,c=a.getChildren('brush')[0],d=c.getLabelSpace(),e=a.getChildren('scrollbar')[0];c.setMaxBrushDimensions({x:b.startX,y:d,width:this._dimensions.width,height:this._dimensions.height-d-b.scrollbarHeight}),e.setDimension({x:b.scrollbarStart,y:this._dimensions.height-b.scrollbarHeight,height:b.scrollbarHeight,width:this._dimensions.width+2*b.scrollbarButtonWidth+1}),a.setScrollbarConfig('width',this._dimensions.width+2*b.scrollbarButtonWidth+1),e.config.scrollRatio=a.getScrollRatio(),a.setScrollbarConfig('scrollRatio',e.config.scrollRatio),e.config.scrollPosition=a.getScrollPosition(),a.setScrollbarConfig('scrollPosition',e.config.scrollPosition)}getDimension(){return this._dimensions}configureAttributes(a={}){super.configureAttributes(a);let b,c,d,e,f,g,h,i,j,k=this,l=k.config,m=k.getFromEnv('dataSource'),n=m.chart&&m.chart.style&&m.chart.style.navigator||{},o=k.getFromEnv('getStyleDef'),p=l.defaultButtonStyle,q=l.defaultTrackStyle,r=l.defaultScrollBarStyle;l.style=n,b=l.style.scrollbar||{},c=Object.assign({},r,o(b.scroller)),e=Object.assign({},p,o(b.button)),d=Object.assign({},q,o(b.track)),f=c.fill,g=d.fill,h=e.fill,i=`#${getDarkColor(h,60)}`,j=`#${getDarkColor(f,60)}`,a.x&&(l.xConfigs=a.x),a.y&&(l.yConfigs=a.y),a.tableMap&&(l.tableMap=a.tableMap),a.values&&(l.values=a.values),a.plots&&(l.plotConfigs=a.plots),k.addToEnv('timeNavigator',k),k.addToEnv('timeNavigatorConfig',l),k.setScrollbarConfig('anchorFill',f),k.setScrollbarConfig('anchorStroke','none'),k.setScrollbarConfig('trackFill',g),k.setScrollbarConfig('trackStroke','none'),k.setScrollbarConfig('buttonFill',h),k.setScrollbarConfig('buttonStroke','none'),k.setScrollbarConfig('buttonPointerFill',i),k.setScrollbarConfig('drawStripes',1),k.setScrollbarConfig('stripesStroke',j),k.setScrollbarConfig('restrictScrollAnchor',0)}attachHandlers(){let a,b,c,d=this;d.addEventListener('fc-mouseover',d.mouseoverHandler||(d.mouseoverHandler=function(){clearTimeout(d.mouseoutTimer),a=this.getChildren('brush')[0],b=a.getChildren('leftLabel')[0],c=a.getChildren('rightLabel')[0],b.config.showLabel||c.config.showLabel||(b.setData({showLabel:!0},!0),c.setData({showLabel:!0},!0))})),d.addEventListener('fc-mouseup',d.mouseupHandler||(d.mouseupHandler=function(){a.config.pointerReleasedOnParent=!0})),d.addEventListener('fc-mouseout',d.mouseoutHandler||(d.mouseoutHandler=function(){d.config.labelsGettingDragged||(d.mouseoutTimer=setTimeout(function(){b.setData({showLabel:!1},!0),c.setData({showLabel:!1},!0)},20))}))}draw(){let a=this;a.addGraphicalElement({el:'group',container:{id:'tropo',label:'group',isParent:!0},component:a,label:'group',attr:{name:'timenav-tropo',transform:a.config.translate},id:'tropo'}),a.addGraphicalElement({el:'group',container:{id:'strato',label:'group',isParent:!0},component:a,label:'group',attr:{name:'timenav-strato',transform:a.config.translate},id:'strato'}),a.addGraphicalElement({el:'group',container:{id:'meso',label:'group',isParent:!0},component:a,label:'group',attr:{name:'timenav-meso',transform:a.config.translate},id:'meso'}),a.addGraphicalElement({el:'group',container:{id:'thermo',label:'group',isParent:!0},component:a,label:'group',attr:{name:'timenav-thermo',transform:a.config.translate},id:'thermo'}),a.addGraphicalElement({el:'group',container:{id:'exo',label:'group',isParent:!0},component:a,label:'group',attr:{name:'timenav-exo',transform:a.config.translate},id:'exo'}),a.addGraphicalElement({el:'group',attr:{name:'time-axis-group'},id:'axisTopGroup',label:'group',container:{id:'strato',label:'group'},component:a},!0),a.addGraphicalElement({el:'group',attr:{name:'scrollbar-group'},id:'scrollbarContainer',label:'scrollbar',container:{id:'thermo',label:'group'},component:a},!0),a.setChildDimension()}setScrollbarConfig(a,b){this._scrollbarConfig[a]=b}getScrollbarConfig(a){return a?this._scrollbarConfig[a]:this._scrollbarConfig}validateDomain(a){let b=this,c=b.getFromEnv('chart'),d=b.config.contextScale,e=d.getDomainValue(a[0]),f=d.getDomainValue(a[1]);c.setFocusLimit([e,f])}getScrollRatio(){let a=this,b=a.getChildren('scrollbar')[0].config,c=b.width,d=b.height,e=2*Math.min(d,.5*c),f=a.getChildren('brush')[0],g=f.getCurrentBrushDimensions().width;return(g+1)/Math.max(.001,c-e)}getScrollPosition(){let a=this,b=a.getChildren('scrollbar')[0].config,c=b.width,d=b.height,e=2*Math.min(d,.5*c),f=a.getChildren('brush')[0],g=f.getCurrentBrushDimensions().x,h=f.getCurrentBrushDimensions().width,i=a.getScrollbarConfig('scrollRatio'),j=i*(c-e),k=e/2+j/2-a.config.scrollbarButtonWidth;return(g+h/2-k)/(c-(e+j))}getDSdef(){return Line}}export default TimeNavigator;