diff --git a/ChartsSpace/TimeMachine.js b/ChartsSpace/TimeMachine.js index 2a2bc8ff8..c8c5be462 100644 --- a/ChartsSpace/TimeMachine.js +++ b/ChartsSpace/TimeMachine.js @@ -45,6 +45,8 @@ function newTimeMachine () { let syncWithDesignerLoop = 0 let timelineChartsMap = new Map() + let onViewportPositionChangedEventSuscriptionId + let onViewportZoomChangedEventSuscriptionId let onMouseOverEventSuscriptionId let onMouseNotOverEventSuscriptionId let timeScaleValueEventSuscriptionId @@ -70,6 +72,9 @@ function newTimeMachine () { } function finalize () { + canvas.chartSpace.viewport.eventHandler.stopListening(onViewportPositionChangedEventSuscriptionId) + canvas.chartSpace.viewport.eventHandler.stopListening(onViewportZoomChangedEventSuscriptionId) + if (thisObject.timeScale !== undefined) { finalizeTimeScale() } @@ -134,45 +139,48 @@ function newTimeMachine () { loadFrame(thisObject.payload, thisObject.container.frame) recalculateCoordinateSystem() + recalculateCurrentDatetime() onMouseOverEventSuscriptionId = thisObject.container.eventHandler.listenToEvent('onMouseOver', onMouseOver) - - function onMouseOver (event) { - drawScales = true - - mouse.position.x = event.x - mouse.position.y = event.y - - if (thisObject.timeScale !== undefined) { - thisObject.timeScale.onMouseOverSomeTimeMachineContainer(event) - } - if (thisObject.rateScale !== undefined) { - thisObject.rateScale.onMouseOverSomeTimeMachineContainer(event) - } - if (thisObject.timeFrameScale !== undefined) { - thisObject.timeFrameScale.onMouseOverSomeTimeMachineContainer(event) - } - } - onMouseNotOverEventSuscriptionId = thisObject.container.eventHandler.listenToEvent('onMouseNotOver', onMouseNotOver) - function onMouseNotOver (event) { - drawScales = false - - if (thisObject.timeScale !== undefined) { - thisObject.timeScale.visible = false - } - if (thisObject.rateScale !== undefined) { - thisObject.rateScale.visible = false - } - if (thisObject.timeFrameScale !== undefined) { - thisObject.timeFrameScale.visible = false - } - } + onViewportPositionChangedEventSuscriptionId = canvas.chartSpace.viewport.eventHandler.listenToEvent('Position Changed', onViewportPositionChanged) + onViewportZoomChangedEventSuscriptionId = canvas.chartSpace.viewport.eventHandler.listenToEvent('Zoom Changed', onViewportZoomChanged) callBackFunction(GLOBAL.DEFAULT_OK_RESPONSE) } + function onMouseOver (event) { + drawScales = true + + mouse.position.x = event.x + mouse.position.y = event.y + + if (thisObject.timeScale !== undefined) { + thisObject.timeScale.onMouseOverSomeTimeMachineContainer(event) + } + if (thisObject.rateScale !== undefined) { + thisObject.rateScale.onMouseOverSomeTimeMachineContainer(event) + } + if (thisObject.timeFrameScale !== undefined) { + thisObject.timeFrameScale.onMouseOverSomeTimeMachineContainer(event) + } + } + + function onMouseNotOver (event) { + drawScales = false + + if (thisObject.timeScale !== undefined) { + thisObject.timeScale.visible = false + } + if (thisObject.rateScale !== undefined) { + thisObject.rateScale.visible = false + } + if (thisObject.timeFrameScale !== undefined) { + thisObject.timeFrameScale.visible = false + } + } + function initializeTimeScale () { thisObject.timeScale = newTimeScale() thisObject.timeScale.fitFunction = thisObject.fitFunction @@ -291,6 +299,39 @@ function newTimeMachine () { } } + function onViewportZoomChanged (event) { + if (thisObject.container.frame.isInViewPort()) { + recalculateCurrentDatetime() + } + } + + function onViewportPositionChanged () { + if (thisObject.container.frame.isInViewPort()) { + recalculateCurrentDatetime() + } + } + + function recalculateCurrentDatetime () { + /* + The view port was moved or the view port zoom level was changed and the center of the screen points to a different datetime that we + must calculate. + */ + let center = { + x: (canvas.chartSpace.viewport.visibleArea.bottomRight.x - canvas.chartSpace.viewport.visibleArea.bottomLeft.x) / 2, + y: (canvas.chartSpace.viewport.visibleArea.bottomRight.y - canvas.chartSpace.viewport.visibleArea.topRight.y) / 2 + } + + center = unTransformThisPoint(center, thisObject.container) + center = timeMachineCoordinateSystem.unInverseTransform(center, thisObject.container.frame.height) + + datetime = new Date(center.x) + + for (let i = 0; i < thisObject.timelineCharts.length; i++) { + let timelineChart = thisObject.timelineCharts[i] + timelineChart.setDatetime(datetime) + } + } + function fitFunction (point, fullVisible, margin, topMargin, bottomMargin) { /* We prevent a point to be out of the container AND out of the Chart Space in general */ diff --git a/ChartsSpace/TimelineChart.js b/ChartsSpace/TimelineChart.js index dd83c16fd..0b2ba2c25 100644 --- a/ChartsSpace/TimelineChart.js +++ b/ChartsSpace/TimelineChart.js @@ -18,6 +18,7 @@ function newTimelineChart () { layersManager: undefined, plotterManager: undefined, upstreamTimeFrame: undefined, + setDatetime: setDatetime, setTimeFrame: setTimeFrame, physics: physics, draw: draw, @@ -35,8 +36,6 @@ function newTimelineChart () { let layersPanel let layersPanelHandle - let onViewportPositionChangedEventSuscriptionId - let onViewportZoomChangedEventSuscriptionId let onMouseOverEventSuscriptionId let onMouseNotOverEventSuscriptionId let rateScaleValueEventSuscriptionId @@ -77,8 +76,6 @@ function newTimelineChart () { finalizeTimeFrameScale() } - canvas.chartSpace.viewport.eventHandler.stopListening(onViewportPositionChangedEventSuscriptionId) - canvas.chartSpace.viewport.eventHandler.stopListening(onViewportZoomChangedEventSuscriptionId) thisObject.container.eventHandler.stopListening(onMouseOverEventSuscriptionId) thisObject.container.eventHandler.stopListening(onMouseNotOverEventSuscriptionId) thisObject.container.finalize() @@ -145,11 +142,6 @@ function newTimelineChart () { coordinateSystem = timeMachineCoordinateSystem timeFrame = INITIAL_TIME_PERIOD - recalculateCurrentDatetime() - - /* Event Subscriptions - we need this events to be fired first here and then in active Plotters. */ - onViewportPositionChangedEventSuscriptionId = canvas.chartSpace.viewport.eventHandler.listenToEvent('Position Changed', onViewportPositionChanged) - onViewportZoomChangedEventSuscriptionId = canvas.chartSpace.viewport.eventHandler.listenToEvent('Zoom Changed', onViewportZoomChanged) onMouseOverEventSuscriptionId = thisObject.container.eventHandler.listenToEvent('onMouseOver', onMouseOver) onMouseNotOverEventSuscriptionId = thisObject.container.eventHandler.listenToEvent('onMouseNotOver', onMouseNotOver) @@ -247,6 +239,13 @@ function newTimelineChart () { } } + function setDatetime (pDatetime) { + datetime = pDatetime + if (thisObject.plotterManager !== undefined) { + thisObject.plotterManager.setDatetime(datetime) + } + } + function onMouseOver (event) { /* This event gets to the timelinechart container because it inherits it from the time machine container, which is the one raising Mouse Over and Mouse not Over Events to its children. */ drawScales = true @@ -277,43 +276,6 @@ function newTimelineChart () { } } - function onViewportZoomChanged (event) { - if (thisObject.container.frame.isInViewPort()) { - recalculateCurrentDatetime() - } - } - - function onViewportPositionChanged () { - if (thisObject.container.frame.isInViewPort()) { - recalculateCurrentDatetime() - } - } - - function recalculateCurrentDatetime () { - /* - - The view port was moved or the view port zoom level was changed and the center of the screen points to a different datetime that we - must calculate. - - */ - - let center = { - x: (canvas.chartSpace.viewport.visibleArea.bottomRight.x - canvas.chartSpace.viewport.visibleArea.bottomLeft.x) / 2, - y: (canvas.chartSpace.viewport.visibleArea.bottomRight.y - canvas.chartSpace.viewport.visibleArea.topRight.y) / 2 - } - - center = unTransformThisPoint(center, thisObject.container) - center = coordinateSystem.unInverseTransform(center, thisObject.container.frame.height) - - let newDate = new Date(center.x) - - datetime = newDate - - if (thisObject.plotterManager !== undefined) { - thisObject.plotterManager.setDatetime(datetime) - } - } - function getContainer (point, purpose) { let container