@fusioncharts/fusiontime/src/_internal/components/custom-range-selector/manager.js

FusionCharts JavaScript time-series charting framework

"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule=true;exports.formatDate=exports.default=void 0;var _inheritsLoose2=_interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _componentInterface=require("@fusioncharts/core/src/component-interface");var _fcCalendar=_interopRequireDefault(require("../../../vendors/fc-calendar/dist/fc-calendar"));var _lib=require("@fusioncharts/core/src/lib");var _dateBox=_interopRequireDefault(require("./date-box"));var _timeBox=_interopRequireDefault(require("./time-box"));var _button=_interopRequireDefault(require("./button"));var _isObject=_interopRequireDefault(require("@fusioncharts/utils/src/type/is-object"));var _language_maps=require("@fusioncharts/utils/src/language_maps");var DEFAULT_CALENDAR_GAP=25,DEFAULT_VERTICAL_PADDING=8,DEFAULT_HORIZONTAL_PADDING=5,DEFAULT_WIDGET_FONT_SIZE=11,CALENDAR_KEY="cal-",CALENDAR_KEY_LEN=CALENDAR_KEY.length,MOBILE="mobile",DESKTOP="desktop",ENGLISH="english",LANGUAGE="language",getCssObj=function getCssObj(obj,getStyleDef){var output={};if((0,_isObject.default)(obj)){for(var key in obj){if(obj.hasOwnProperty(key)&&key.startsWith(CALENDAR_KEY)){output[key.substring(CALENDAR_KEY_LEN)]=getStyleDef(obj[key])}}}return output},formatDate=exports.formatDate=function formatDate(x){return(x<10?"0"+x:x)+""},isWithinDate=function isWithinDate(date,start,end){var startDate=new Date(start.year,start.month,start.day),endDate=new Date(end.year,end.month,end.day),curDate=new Date(date.year,date.month,date.day);if(+curDate>=+startDate&&+curDate<=+endDate){return true}return false};var CustomRangeManager=function(_SmartRenderer){function CustomRangeManager(id){var _this;_this=_SmartRenderer.call(this,id)||this;var manager=_this;manager.addToEnv("fontParser",(function(fontsizeArg){var fontsize=parseFloat(fontsizeArg);return isNaN(fontsize)?DEFAULT_WIDGET_FONT_SIZE:fontsize}));return _this}(0,_inheritsLoose2.default)(CustomRangeManager,_SmartRenderer);var _proto=CustomRangeManager.prototype;_proto.__setDefaultConfig=function __setDefaultConfig(){var managerConfig=this.config;managerConfig.paddingLeft=10;managerConfig.paddingRight=10;managerConfig.paddingTop=15;managerConfig.paddingBottom=15;managerConfig.prevVisibility="hidden";managerConfig.contextStart={year:1970,month:1,day:1};managerConfig.contextEnd={year:2070,month:1,day:1};managerConfig.calendarDim={height:191,width:163};this._calendars={};managerConfig._backgroundStyle={"font-size":DEFAULT_WIDGET_FONT_SIZE+_lib.PXSTRING,"font-family":"Verdana,sans-serif",border:"1px solid #cdcdcd",position:"absolute","border-radius":"0px","overflow-y":"visible","background-color":"#ffffff"};managerConfig._mobileBgStyle=Object.assign({},managerConfig._backgroundStyle,{position:"fixed","overflow-y":"scroll","border-radius":"10px"});managerConfig._pointerStyle={"font-size":DEFAULT_WIDGET_FONT_SIZE+_lib.PXSTRING,"font-family":"Verdana,sans-serif","border-left":"1px solid #cdcdcd","border-right":"0px solid #cdcdcd","border-top":"1px solid #cdcdcd","border-bottom":"0px solid #cdcdcd",transform:"rotate(45deg)","background-color":"#ffffff"}};_proto.configureAttributes=function configureAttributes(inputConfig){var _this$getFromEnv;if(inputConfig===void 0){inputConfig={}}var manager=this,managerConfig=manager.config,calendars=manager.getCalendars(),extStyle,styleDef=manager.getFromEnv("getStyleDef"),baseTextStyle=manager.getFromEnv("baseTextStyle"),lang=(_this$getFromEnv=this.getFromEnv(LANGUAGE))!=null?_this$getFromEnv:ENGLISH,leftDateBoxLabel=_language_maps.dateBoxLabelMap[lang].From,rightDateBoxLabel=_language_maps.dateBoxLabelMap[lang].To,submitButtonLabel=_language_maps.crsButtonLabelsMap[lang].apply,cancelButtonLabel=_language_maps.crsButtonLabelsMap[lang].cancel,tempDate,leftDateConfig,rightDateConfig,applyButtonStyle,cancelButtonStyle;Object.assign(managerConfig,inputConfig);extStyle=managerConfig.extStyle;if(managerConfig.visibility!==managerConfig.prevVisibility){tempDate=false;managerConfig.blockUpdate=false}else{managerConfig.blockUpdate=true}managerConfig.prevVisibility=managerConfig.visibility;if(managerConfig.visibility!=="visible"){if(calendars.left){calendars.left.dispose();delete calendars.left}if(calendars.right){calendars.right.dispose();delete calendars.right}return}leftDateConfig={label:leftDateBoxLabel,date:managerConfig.leftCalSelectedDate,id:"left",labelStyle:extStyle.label,inputStyle:extStyle.input};rightDateConfig={label:rightDateBoxLabel,date:managerConfig.rightCalSelectedDate,id:"right",labelStyle:extStyle.label,inputStyle:extStyle.input};if(typeof tempDate!=="undefined"){leftDateConfig.tempDate=rightDateConfig.tempDate=tempDate}manager.attachChild(_dateBox.default,"left-date","left-date").configure(leftDateConfig);manager.attachChild(_dateBox.default,"right-date","right-date").configure(rightDateConfig);if(managerConfig.showTime){manager.attachChild(_timeBox.default,"left-time","left-time").configure({time:managerConfig.leftCalSelectedDate,labelStyle:extStyle.label,selectStyle:extStyle.select});manager.attachChild(_timeBox.default,"right-time","right-time").configure({time:managerConfig.rightCalSelectedDate,labelStyle:extStyle.label,selectStyle:extStyle.select})}if(extStyle["button-apply"]){applyButtonStyle=Object.assign({},baseTextStyle,extStyle["button-apply"])}else{applyButtonStyle=Object.assign({color:"#ffffff","font-size":DEFAULT_WIDGET_FONT_SIZE+_lib.PXSTRING},baseTextStyle)}manager.attachChild(_button.default,"apply","apply").configure({label:submitButtonLabel,type:"submit",customStyle:applyButtonStyle,buttonStyle:applyButtonStyle,"button:hoverout":applyButtonStyle,"button:hover":extStyle["button-apply:hover"]||{}});if(extStyle["button-cancel"]){cancelButtonStyle=Object.assign({},baseTextStyle,extStyle["button-cancel"])}else{cancelButtonStyle=Object.assign({backgroundColor:"#ffffff",color:"#7A7A7A",border:"0px","font-size":DEFAULT_WIDGET_FONT_SIZE+_lib.PXSTRING},baseTextStyle)}manager.attachChild(_button.default,"cancel","cancel").configure({label:cancelButtonLabel,type:"cancel",customStyle:cancelButtonStyle,buttonStyle:cancelButtonStyle,"button:hoverout":cancelButtonStyle,"button:hover":extStyle["button-cancel:hover"]||{}});managerConfig._finalBackgroundStyle=Object.assign({},managerConfig._backgroundStyle,styleDef(extStyle.container));managerConfig._finalMobileBgStyle=Object.assign({},managerConfig._mobileBgStyle,styleDef(extStyle.container));managerConfig._finalPointerStyle=Object.assign({},managerConfig._pointerStyle,styleDef(extStyle.container));if(managerConfig._finalPointerStyle.border){managerConfig._finalPointerStyle["border-left"]=managerConfig._finalPointerStyle["border-top"]=managerConfig._finalPointerStyle.border}managerConfig._finalPointerStyle["border-right"]=managerConfig._finalPointerStyle["border-bottom"]="0px";delete managerConfig._finalPointerStyle.border;managerConfig.calStyle=getCssObj(managerConfig.extStyle,manager.getFromEnv("getStyleDef"))};_proto.manageSpace=function manageSpace(mode){if(mode===void 0){mode=DESKTOP}if(mode===DESKTOP){this.manageSpaceLG()}else{this.manageSpaceSM()}};_proto.manageSpaceSM=function manageSpaceSM(){var manager=this,managerConfig=manager.config,clientHeight=document.documentElement.clientHeight,clientWidth=document.documentElement.clientWidth,maxAllowedHeight=.8*clientHeight,fromDate,toDate,fromTime,toTime,fromTimeDim={height:0,width:0},toTimeDim={height:0,width:0},fromLabelBoxDim,toLabelBoxDim,apply,cancel,xPos,availableWidth,paddingLeft=50,paddingRight=50,curYPos=managerConfig.paddingTop,calendarDim=managerConfig.calendarDim,applyDim,cancelDim;if(managerConfig.visibility!=="visible"){return}fromDate=manager.getChildren("left-date")[0];toDate=manager.getChildren("right-date")[0];fromTime=manager.getChildren("left-time");toTime=manager.getChildren("right-time");apply=manager.getChildren("apply")[0];cancel=manager.getChildren("cancel")[0];if(fromTime){fromTime=fromTime[0];fromTimeDim=fromTime.getDimension()}if(toTime){toTime=toTime[0];toTimeDim=toTime.getDimension()}fromLabelBoxDim=fromDate.getDimension();toLabelBoxDim=toDate.getDimension();applyDim=apply.getDimension();cancelDim=cancel.getDimension();availableWidth=Math.max(calendarDim.width,fromLabelBoxDim.width,toLabelBoxDim.width,fromTimeDim.width,toTimeDim.width,applyDim.width+cancelDim.width+DEFAULT_VERTICAL_PADDING);fromDate.setTranslation(paddingLeft,curYPos);xPos=paddingLeft+availableWidth/2-calendarDim.width/2;curYPos+=fromLabelBoxDim.height+DEFAULT_VERTICAL_PADDING;managerConfig.leftCalendarPosition={x:xPos,y:curYPos};curYPos+=calendarDim.height+DEFAULT_VERTICAL_PADDING;fromTime&&fromTime.setTranslation(paddingLeft,curYPos);curYPos+=fromTimeDim.height+2*DEFAULT_VERTICAL_PADDING;toDate.setTranslation(paddingLeft,curYPos);xPos=paddingLeft+availableWidth/2-calendarDim.width/2;curYPos+=toLabelBoxDim.height+DEFAULT_VERTICAL_PADDING;managerConfig.rightCalendarPosition={x:xPos,y:curYPos};curYPos+=calendarDim.height+DEFAULT_VERTICAL_PADDING;toTime&&toTime.setTranslation(paddingLeft,curYPos);curYPos+=toTimeDim.height+DEFAULT_VERTICAL_PADDING;apply.setTranslation(paddingLeft,curYPos);cancel.setTranslation(paddingLeft+applyDim.width+DEFAULT_VERTICAL_PADDING,curYPos);if(maxAllowedHeight>curYPos+applyDim.height+managerConfig.paddingBottom){managerConfig.height=curYPos+applyDim.height+managerConfig.paddingBottom;managerConfig.y=clientHeight/2-managerConfig.height/2}else{managerConfig.height=maxAllowedHeight;managerConfig.y=.1*clientHeight}managerConfig.width=calendarDim.width+paddingLeft+paddingRight;managerConfig.x=clientWidth/2-managerConfig.width/2};_proto.manageSpaceLG=function manageSpaceLG(){var manager=this,managerConfig=manager.config,fromLabelBoxDim,toLabelBoxDim,timeBoxPaddingFactor=4,fromDate,toDate,fromTime,toTime,apply,cancel,maxSpaceTakenOnLeft=0,maxSpaceTakenOnRight=0,fromTimeDim={height:0,width:0},toTimeDim={height:0,width:0},applyDim,cancelDim,calendarDim=managerConfig.calendarDim,tool=manager.getLinkedParent(),position=tool.config.containerPos;if(managerConfig.visibility!=="visible"){return}fromDate=manager.getChildren("left-date")[0];toDate=manager.getChildren("right-date")[0];fromTime=manager.getChildren("left-time");toTime=manager.getChildren("right-time");apply=manager.getChildren("apply")[0];cancel=manager.getChildren("cancel")[0];if(fromTime){fromTime=fromTime[0];fromTimeDim=fromTime.getDimension()}if(toTime){toTime=toTime[0];toTimeDim=toTime.getDimension()}!fromTimeDim.height&&(timeBoxPaddingFactor=2);fromLabelBoxDim=fromDate.getDimension();toLabelBoxDim=toDate.getDimension();applyDim=apply.getDimension();cancelDim=cancel.getDimension();maxSpaceTakenOnLeft=Math.max(fromTimeDim.width,fromLabelBoxDim.width,calendarDim.width);managerConfig.leftCalendarPosition={x:managerConfig.paddingLeft,y:managerConfig.paddingTop+fromLabelBoxDim.height+DEFAULT_VERTICAL_PADDING};managerConfig.rightCalendarPosition={x:managerConfig.paddingLeft+maxSpaceTakenOnLeft+DEFAULT_CALENDAR_GAP,y:managerConfig.paddingTop+toLabelBoxDim.height+DEFAULT_VERTICAL_PADDING};fromDate.setTranslation(managerConfig.paddingLeft,managerConfig.paddingTop);toDate.setTranslation(managerConfig.paddingLeft+maxSpaceTakenOnLeft+DEFAULT_CALENDAR_GAP,managerConfig.paddingTop);fromTime&&fromTime.setTranslation(managerConfig.paddingLeft,managerConfig.leftCalendarPosition.y+calendarDim.height+2*DEFAULT_VERTICAL_PADDING);toTime&&toTime.setTranslation(managerConfig.paddingLeft+maxSpaceTakenOnLeft+DEFAULT_CALENDAR_GAP,managerConfig.rightCalendarPosition.y+calendarDim.height+2*DEFAULT_VERTICAL_PADDING);apply.setTranslation(managerConfig.paddingLeft,managerConfig.leftCalendarPosition.y+calendarDim.height+timeBoxPaddingFactor*DEFAULT_VERTICAL_PADDING+fromTimeDim.height);cancel.setTranslation(managerConfig.paddingLeft+applyDim.width+DEFAULT_HORIZONTAL_PADDING,managerConfig.leftCalendarPosition.y+calendarDim.height+timeBoxPaddingFactor*DEFAULT_VERTICAL_PADDING+fromTimeDim.height);maxSpaceTakenOnRight=Math.max(managerConfig.paddingLeft+applyDim.width+DEFAULT_HORIZONTAL_PADDING+cancelDim.width,managerConfig.rightCalendarPosition.x+calendarDim.width,managerConfig.paddingLeft+maxSpaceTakenOnLeft+DEFAULT_CALENDAR_GAP+toTimeDim.width,managerConfig.paddingLeft+maxSpaceTakenOnLeft+DEFAULT_CALENDAR_GAP+toLabelBoxDim.width);managerConfig.width=maxSpaceTakenOnRight+managerConfig.paddingRight;managerConfig.height=managerConfig.leftCalendarPosition.y+calendarDim.height+applyDim.height+timeBoxPaddingFactor*DEFAULT_VERTICAL_PADDING+fromTimeDim.height+managerConfig.paddingBottom;managerConfig.x=position.x-managerConfig.width/2;managerConfig.y=position.y+DEFAULT_VERTICAL_PADDING/2};_proto.isWithinWidget=function isWithinWidget(x,y){var config=this.config,left=config.x,top=config.y,bottom=top+config.height,right=left+config.width;return x>left&&x<right&&y>top&&y<bottom};_proto.draw=function draw(){var _this$getFromEnv2;var manager=this,managerConfig=manager.config,_finalMobileBgStyle=managerConfig._finalMobileBgStyle,_finalBackgroundStyle=managerConfig._finalBackgroundStyle,mode=managerConfig.visualMode=window.innerWidth<576?MOBILE:DESKTOP,bgStyle=mode===MOBILE?_finalMobileBgStyle:_finalBackgroundStyle;managerConfig.language=(_this$getFromEnv2=this.getFromEnv("language"))!=null?_this$getFromEnv2:ENGLISH;if(managerConfig.visibility==="hidden")return;if(mode===MOBILE){bgStyle["overflow-y"]="scroll"}manager.manageSpace(mode);manager.addGraphicalElement({el:"html",attr:{x:managerConfig.x,y:managerConfig.y,width:managerConfig.width,height:managerConfig.height,type:"div",fill:"ffffff",display:"block",class:"fc-crs-widget",visibility:managerConfig.visibility},css:bgStyle,component:manager,label:"box-container",id:"box-container"});mode!==MOBILE&&manager.addGraphicalElement({el:"html",attr:{x:managerConfig.width/2-10,y:-9,width:15,height:15,type:"div",display:"block",visibility:managerConfig.visibility},css:managerConfig._finalPointerStyle,container:{label:"box-container",id:"box-container"},component:manager,label:"box-pointer",id:"box-pointer"});managerConfig.drawCalendars&&manager.drawCalendars();managerConfig.mode=mode};_proto.getCalendars=function getCalendars(){return this._calendars};_proto.drawCalendars=function drawCalendars(){var manager=this,config=manager.config,calendars=manager.getCalendars(),leftCalendarPosition=config.leftCalendarPosition,rightCalendarPosition=config.rightCalendarPosition,container=manager.getGraphicalElement("box-container","box-container").element,mode=window.innerWidth<576?MOBILE:DESKTOP,curCalendarDim,calStyle=config.calStyle,language=config.language;if(config.mode===mode&&config.blockUpdate&&calendars.left&&calendars.right){return}if(!calendars.left){calendars.left=new _fcCalendar.default({weekLabel:_language_maps.weekLabelMap[language],monthLabel:_language_maps.monthsMap[language],selectedDate:config.leftCalSelectedDate,posX:leftCalendarPosition.x,posY:leftCalendarPosition.y,container:container,id:"left",rangeStart:config.contextStart,rangeEnd:config.contextEnd,showInactiveMonths:true,customCssClass:calStyle,language:language,events:{onDateChange:function onDateChange(date){manager.updateDate(date,"left")},onMonthChange:function onMonthChange(date){manager.updateDate(date,"left")},onYearChange:function onYearChange(date){manager.updateDate(date,"left")}},"font-family":_lib.DEFAULT_FT_FONT+" !important"})}else{calendars.left.configure({weekLabel:_language_maps.weekLabelMap[language],monthLabel:_language_maps.monthsMap[language],selectedDate:config.leftCalSelectedDate,posX:leftCalendarPosition.x,posY:leftCalendarPosition.y,rangeStart:config.contextStart,rangeEnd:config.contextEnd,customCssClass:calStyle,showInactiveMonths:true,container:container,language:language})}if(!calendars.right){calendars.right=new _fcCalendar.default({weekLabel:_language_maps.weekLabelMap[language],monthLabel:_language_maps.monthsMap[language],selectedDate:config.rightCalSelectedDate,posX:rightCalendarPosition.x,posY:rightCalendarPosition.y,rangeStart:config.contextStart,rangeEnd:config.contextEnd,showInactiveMonths:true,customCssClass:calStyle,language:language,container:container,id:"right",events:{onDateChange:function onDateChange(date){manager.updateDate(date,"right")},onMonthChange:function onMonthChange(date){manager.updateDate(date,"right")},onYearChange:function onYearChange(date){manager.updateDate(date,"right")}},"font-family":_lib.DEFAULT_FT_FONT+" !important"})}else{calendars.right.configure({weekLabel:_language_maps.weekLabelMap[language],monthLabel:_language_maps.monthsMap[language],selectedDate:config.rightCalSelectedDate,posX:rightCalendarPosition.x,posY:rightCalendarPosition.y,rangeStart:config.contextStart,rangeEnd:config.contextEnd,customCssClass:calStyle,showInactiveMonths:true,container:container,language:language})}curCalendarDim=calendars.left.getDimension();if(curCalendarDim.width!==config.calendarDim.width||curCalendarDim.height!==config.calendarDim.height){config.calendarDim=curCalendarDim;manager.asyncDraw()}};_proto.updateDate=function updateDate(date,id){var manager=this,labelBox=manager.getChildren(id+"-date")[0],element=labelBox.getGraphicalElement("box","box");labelBox.setData({date:date,tempDate:false},true);element.element.value=formatDate(date.day)+"/"+formatDate(date.month)+"/"+formatDate(date.year)};_proto.updateCalendar=function updateCalendar(date,id){var manager=this,managerConfig=manager.config,calendars=manager.getCalendars(),selectedDate=managerConfig[id+"CalSelectedDate"];if(isWithinDate(date,managerConfig.contextStart,managerConfig.contextEnd)){managerConfig[id+"CalSelectedDate"]=date;selectedDate.day=date.day;selectedDate.month=date.month;selectedDate.year=date.year;calendars[id]&&calendars[id].configure({selectedDate:date})}else{manager.getChildren(id+"-date")[0].setData({},true)}};_proto.submitData=function submitData(type){var _this$getFromEnv3;if(type===void 0){type="cancel"}var manager=this,rangeSelector=manager.getLinkedParent(),chart=rangeSelector.getFromEnv("chart"),scale=chart.getFromEnv("contextScalesX")[0],curDomain=[],calendars=manager.getCalendars(),isUTC=chart.getFromEnv("UTC"),leftDate=calendars.left.getDate(),rightDate=calendars.right.getDate(),fromTimeComp=manager.getChildren("left-time"),toTimeComp=manager.getChildren("right-time"),formattedDateTexts,showTimeInLabel,language=(_this$getFromEnv3=this.getFromEnv("language"))!=null?_this$getFromEnv3:ENGLISH,d1,d2,fromTime={hours:0,minutes:0,seconds:0},toTime={hours:0,minutes:0,seconds:0};if(fromTimeComp){fromTime=fromTimeComp[0].getTime()}if(toTimeComp){toTime=toTimeComp[0].getTime()}rangeSelector.setData({},true);if(type==="submit"){d1=isUTC?Date.UTC(leftDate.year,leftDate.month-1,leftDate.day,fromTime.hours,fromTime.minutes,fromTime.seconds):new Date(leftDate.year,leftDate.month-1,leftDate.day,fromTime.hours,fromTime.minutes,fromTime.seconds);d2=isUTC?Date.UTC(rightDate.year,rightDate.month-1,rightDate.day,toTime.hours,toTime.minutes,toTime.seconds):new Date(rightDate.year,rightDate.month-1,rightDate.day,toTime.hours,toTime.minutes,toTime.seconds);curDomain.push(+d1);curDomain.push(+d2);chart.setFocusLimit(curDomain);showTimeInLabel=rangeSelector.decideTimeInLabel();formattedDateTexts=scale.getFormattedTime({dateRange:{startDate:d1,endDate:d2},type:"CRS",showTimeInLabel:showTimeInLabel,language:language}).split(" - ");chart.fireChartInstanceEvent("customRangeSelect",{start:+d1,end:+d2,startText:formattedDateTexts[0],endText:formattedDateTexts[1],formatter:"%b %d, %Y"+(showTimeInLabel?", %H:%M:%S":"")})}rangeSelector.removeDocumentListener()};return CustomRangeManager}(_componentInterface.SmartRenderer);var _default=exports.default=CustomRangeManager;