From 594e4851d8e1ba65aa469c9528dee87cfd179e13 Mon Sep 17 00:00:00 2001 From: Luis Fernando Molina Date: Thu, 11 Apr 2019 10:37:36 +0200 Subject: [PATCH 01/11] Rigth Scale added --- Scales/ChartGrid.js | 7 +++---- Scales/RightScale.js | 17 +++++++++++++++++ Scales/TimeScale.js | 17 ++++++++--------- TimeMachine.js | 4 ++++ 4 files changed, 32 insertions(+), 13 deletions(-) diff --git a/Scales/ChartGrid.js b/Scales/ChartGrid.js index cfa0f4304..86aa268ee 100644 --- a/Scales/ChartGrid.js +++ b/Scales/ChartGrid.js @@ -19,13 +19,10 @@ container.isDraggeable = false container.isClickeable = true - let rigthScale - return thisObject function initialize () { - rigthScale = newRigthScale() - rigthScale.initialize() + } function getContainer (point) { @@ -47,6 +44,8 @@ } function draw (container, timeLineCoordinateSystem) { + return // not for now + rightScaleBackground() leftScaleBackground() diff --git a/Scales/RightScale.js b/Scales/RightScale.js index ec5e4f7cb..67d3ac758 100644 --- a/Scales/RightScale.js +++ b/Scales/RightScale.js @@ -52,6 +52,23 @@ } function draw () { + drawBackground() + } + function drawBackground () { + const RIGHT_MARGIN = 50 + + /* We will paint some transparent background here. */ + + let opacity = '0.95' + + browserCanvasContext.beginPath() + + browserCanvasContext.rect(viewPort.visibleArea.topRight.x, viewPort.visibleArea.topRight.y, RIGHT_MARGIN, viewPort.visibleArea.bottomRight.y - viewPort.visibleArea.topRight.y) + browserCanvasContext.fillStyle = 'rgba(' + UI_COLOR.WHITE + ', ' + opacity + ')' + + browserCanvasContext.closePath() + + browserCanvasContext.fill() } } diff --git a/Scales/TimeScale.js b/Scales/TimeScale.js index cbe523a25..7afaed0d6 100644 --- a/Scales/TimeScale.js +++ b/Scales/TimeScale.js @@ -16,19 +16,18 @@ function newTimeScale () { const RIGHT_MARGIN = 50 - let container = newContainer() - container.initialize(MODULE_NAME) - thisObject.container = container + thisObject.container = newContainer() + thisObject.container.initialize(MODULE_NAME) thisObject.container.frame.width = viewPort.visibleArea.bottomRight.x - viewPort.visibleArea.topLeft.x thisObject.container.frame.height = 100 - container.frame.position.x = viewPort.visibleArea.bottomRight.x - container.frame.position.y = TOP_SPACE_HEIGHT + thisObject.container.frame.position.x = viewPort.visibleArea.bottomRight.x + thisObject.container.frame.position.y = TOP_SPACE_HEIGHT - container.isDraggeable = false - container.isClickeable = false - container.isWheelable = true + thisObject.container.isDraggeable = false + thisObject.container.isClickeable = false + thisObject.container.isWheelable = true return thisObject @@ -55,7 +54,7 @@ function newTimeScale () { /* First we check if this point is inside this object UI. */ if (thisObject.container.frame.isThisPointHere(point, undefined, true) === true) { - return this.container + return thisObject.container } else { /* This point does not belong to this space. */ diff --git a/TimeMachine.js b/TimeMachine.js index bfd9c20eb..b89e5db04 100644 --- a/TimeMachine.js +++ b/TimeMachine.js @@ -41,6 +41,7 @@ function newTimeMachine () { const SEPARATION_BETWEEN_TIMELINE_CHARTS = 1.5 let timeScale + let rigthScale return thisObject @@ -71,6 +72,9 @@ function newTimeMachine () { timeScale = newTimeScale() timeScale.initialize() + rigthScale = newRigthScale() + rigthScale.initialize() + timeScale.container.eventHandler.listenToEvent('Lenght Percentage Changed', function (event) { thisObject.container.frame.width = TIME_MACHINE_WIDTH * event.lenghtPercentage / 100 thisObject.container.eventHandler.raiseEvent('Dimmensions Changed', event) From 41d2d8db745456b7375890a8b8e68772e2314f16 Mon Sep 17 00:00:00 2001 From: Luis Fernando Molina Date: Thu, 11 Apr 2019 10:47:45 +0200 Subject: [PATCH 02/11] Right Scale Connected --- Scales/RightScale.js | 24 +++++++++++++++--------- TimeMachine.js | 8 ++++++++ TimelineChart.js | 10 +++++----- 3 files changed, 28 insertions(+), 14 deletions(-) diff --git a/Scales/RightScale.js b/Scales/RightScale.js index 67d3ac758..8b24475fa 100644 --- a/Scales/RightScale.js +++ b/Scales/RightScale.js @@ -1,4 +1,11 @@ function newRigthScale () { + const MODULE_NAME = 'Right Scale' + const INFO_LOG = false + const INTENSIVE_LOG = false + const ERROR_LOG = true + const logger = newWebDebugLog() + logger.fileName = MODULE_NAME + let thisObject = { container: undefined, draw: draw, @@ -8,19 +15,18 @@ const RIGHT_MARGIN = 50 - let container = newContainer() - container.initialize() - thisObject.container = container + thisObject.container = newContainer() + thisObject.container.initialize(MODULE_NAME) thisObject.container.frame.width = RIGHT_MARGIN thisObject.container.frame.height = viewPort.visibleArea.bottomRight.y - viewPort.visibleArea.topRight.y - container.frame.position.x = viewPort.visibleArea.bottomRight.x - container.frame.position.y = TOP_SPACE_HEIGHT + thisObject.container.frame.position.x = viewPort.visibleArea.bottomRight.x + thisObject.container.frame.position.y = TOP_SPACE_HEIGHT - container.isDraggeable = false - container.isClickeable = false - container.isWheelable = true + thisObject.container.isDraggeable = false + thisObject.container.isClickeable = false + thisObject.container.isWheelable = true return thisObject @@ -43,7 +49,7 @@ /* First we check if this point is inside this object UI. */ if (thisObject.container.frame.isThisPointHere(point, true) === true) { - return this.container + return thisObject.container } else { /* This point does not belong to this space. */ diff --git a/TimeMachine.js b/TimeMachine.js index b89e5db04..8123b0369 100644 --- a/TimeMachine.js +++ b/TimeMachine.js @@ -191,6 +191,7 @@ function newTimeMachine () { } timeScale.draw() + rigthScale.draw() } function getContainer (point, purpose) { @@ -203,6 +204,13 @@ function newTimeMachine () { } } + container = rigthScale.getContainer(point) + if (container !== undefined) { + if (container.isForThisPurpose(purpose)) { + return container + } + } + for (let i = 0; i < this.charts.length; i++) { container = this.charts[i].getContainer(point) if (container !== undefined) { diff --git a/TimelineChart.js b/TimelineChart.js index 7d75c178b..5cc49fe9c 100644 --- a/TimelineChart.js +++ b/TimelineChart.js @@ -25,7 +25,7 @@ thisObject.container.initialize(MODULE_NAME) thisObject.container.detectMouseOver = true - let chartGrid + // let chartGrid let breakpointsBar let initializationReady = false @@ -116,8 +116,8 @@ logoExchange.src = window.canvasApp.urlPrefix + 'Images/' + exchange + '-logo-background.png' logoAA.src = window.canvasApp.urlPrefix + 'Images/sa-logo-background.png' - chartGrid = newChartGrid() - chartGrid.initialize() + // chartGrid = newChartGrid() + // chartGrid.initialize() breakpointsBar = newBreakpointsBar() breakpointsBar.initialize(thisObject.container, timeLineCoordinateSystem) @@ -251,7 +251,7 @@ let container - container = chartGrid.getContainer(point) + // container = chartGrid.getContainer(point) if (container !== undefined) { return container } @@ -321,7 +321,7 @@ if (thisObject.container.frame.isInViewPort()) { drawChartsBackground() - chartGrid.draw(thisObject.container, timeLineCoordinateSystem) + // chartGrid.draw(thisObject.container, timeLineCoordinateSystem) plotterManager.draw() From 5d49e3bf9c998a169221b9ffe702b28d922bf47f Mon Sep 17 00:00:00 2001 From: Luis Fernando Molina Date: Thu, 11 Apr 2019 11:00:06 +0200 Subject: [PATCH 03/11] Right Scale working --- Scales/RightScale.js | 11 ++++++++--- TimeMachine.js | 9 +++++++-- 2 files changed, 15 insertions(+), 5 deletions(-) diff --git a/Scales/RightScale.js b/Scales/RightScale.js index 8b24475fa..8f72ceda2 100644 --- a/Scales/RightScale.js +++ b/Scales/RightScale.js @@ -10,7 +10,8 @@ container: undefined, draw: draw, getContainer: getContainer, - initialize: initialize + initialize: initialize, + heightPercentage: 100 } const RIGHT_MARGIN = 50 @@ -37,10 +38,14 @@ function onMouseWheel (event) { delta = event.wheelDelta if (delta < 0) { - delta = -0.1 + thisObject.heightPercentage = thisObject.heightPercentage - 10 + if (thisObject.heightPercentage < 10) { thisObject.heightPercentage = 10 } } else { - delta = 0.1 + thisObject.heightPercentage = thisObject.heightPercentage + 10 + if (thisObject.heightPercentage > 100) { thisObject.heightPercentage = 100 } } + event.heightPercentage = thisObject.heightPercentage + thisObject.container.eventHandler.raiseEvent('Height Percentage Changed', event) } function getContainer (point) { diff --git a/TimeMachine.js b/TimeMachine.js index 8123b0369..1d6a040ec 100644 --- a/TimeMachine.js +++ b/TimeMachine.js @@ -72,11 +72,16 @@ function newTimeMachine () { timeScale = newTimeScale() timeScale.initialize() + timeScale.container.eventHandler.listenToEvent('Lenght Percentage Changed', function (event) { + thisObject.container.frame.width = TIME_MACHINE_WIDTH * event.lenghtPercentage / 100 + thisObject.container.eventHandler.raiseEvent('Dimmensions Changed', event) + }) + rigthScale = newRigthScale() rigthScale.initialize() - timeScale.container.eventHandler.listenToEvent('Lenght Percentage Changed', function (event) { - thisObject.container.frame.width = TIME_MACHINE_WIDTH * event.lenghtPercentage / 100 + rigthScale.container.eventHandler.listenToEvent('Height Percentage Changed', function (event) { + thisObject.container.frame.height = TIME_MACHINE_HEIGHT * event.heightPercentage / 100 thisObject.container.eventHandler.raiseEvent('Dimmensions Changed', event) }) From 594f9cc70ca7319de134fbf3d273774f8b3e61ca Mon Sep 17 00:00:00 2001 From: Luis Fernando Molina Date: Thu, 11 Apr 2019 11:15:40 +0200 Subject: [PATCH 04/11] STEP_SIZE --- Scales/RightScale.js | 7 ++++--- Scales/TimeScale.js | 7 ++++--- TimelineChart.js | 2 +- 3 files changed, 9 insertions(+), 7 deletions(-) diff --git a/Scales/RightScale.js b/Scales/RightScale.js index 8f72ceda2..08277c02a 100644 --- a/Scales/RightScale.js +++ b/Scales/RightScale.js @@ -15,6 +15,7 @@ } const RIGHT_MARGIN = 50 + const STEP_SIZE = 5 thisObject.container = newContainer() thisObject.container.initialize(MODULE_NAME) @@ -38,10 +39,10 @@ function onMouseWheel (event) { delta = event.wheelDelta if (delta < 0) { - thisObject.heightPercentage = thisObject.heightPercentage - 10 - if (thisObject.heightPercentage < 10) { thisObject.heightPercentage = 10 } + thisObject.heightPercentage = thisObject.heightPercentage - STEP_SIZE + if (thisObject.heightPercentage < STEP_SIZE) { thisObject.heightPercentage = STEP_SIZE } } else { - thisObject.heightPercentage = thisObject.heightPercentage + 10 + thisObject.heightPercentage = thisObject.heightPercentage + STEP_SIZE if (thisObject.heightPercentage > 100) { thisObject.heightPercentage = 100 } } event.heightPercentage = thisObject.heightPercentage diff --git a/Scales/TimeScale.js b/Scales/TimeScale.js index 7afaed0d6..b52ab8c10 100644 --- a/Scales/TimeScale.js +++ b/Scales/TimeScale.js @@ -15,6 +15,7 @@ function newTimeScale () { } const RIGHT_MARGIN = 50 + const STEP_SIZE = 5 thisObject.container = newContainer() thisObject.container.initialize(MODULE_NAME) @@ -38,10 +39,10 @@ function newTimeScale () { function onMouseWheel (event) { delta = event.wheelDelta if (delta < 0) { - thisObject.lenghtPercentage = thisObject.lenghtPercentage - 10 - if (thisObject.lenghtPercentage < 10) { thisObject.lenghtPercentage = 10 } + thisObject.lenghtPercentage = thisObject.lenghtPercentage - STEP_SIZE + if (thisObject.lenghtPercentage < STEP_SIZE) { thisObject.lenghtPercentage = STEP_SIZE } } else { - thisObject.lenghtPercentage = thisObject.lenghtPercentage + 10 + thisObject.lenghtPercentage = thisObject.lenghtPercentage + STEP_SIZE if (thisObject.lenghtPercentage > 100) { thisObject.lenghtPercentage = 100 } } event.lenghtPercentage = thisObject.lenghtPercentage diff --git a/TimelineChart.js b/TimelineChart.js index 5cc49fe9c..de2ed5f5f 100644 --- a/TimelineChart.js +++ b/TimelineChart.js @@ -66,7 +66,7 @@ thisObject.container.eventHandler.listenToEvent('Dimmensions Changed', function (event) { recalculateScale() - moveToUserPosition(thisObject.container, timeLineCoordinateSystem, false, true, event.mousePosition) + moveToUserPosition(thisObject.container, timeLineCoordinateSystem, false, false, event.mousePosition) }) thisObject.container.eventHandler.listenToEvent('onMouseOver', function (event) { From 7f8b9b07415d986da2620c818b63a6d85e1fa2f6 Mon Sep 17 00:00:00 2001 From: Luis Fernando Molina Date: Thu, 11 Apr 2019 11:43:17 +0200 Subject: [PATCH 05/11] TimeScale persisted to local storage --- Scales/TimeScale.js | 12 ++++++++- TimeMachine.js | 66 +++++++++++++++++++++++---------------------- 2 files changed, 45 insertions(+), 33 deletions(-) diff --git a/Scales/TimeScale.js b/Scales/TimeScale.js index b52ab8c10..0e2e62417 100644 --- a/Scales/TimeScale.js +++ b/Scales/TimeScale.js @@ -11,9 +11,10 @@ function newTimeScale () { draw: draw, getContainer: getContainer, initialize: initialize, - lenghtPercentage: 100 + lenghtPercentage: undefined } + const LENGHT_PERCENTAGE_DEFAULT_VALUE = 50 const RIGHT_MARGIN = 50 const STEP_SIZE = 5 @@ -34,6 +35,12 @@ function newTimeScale () { function initialize () { thisObject.container.eventHandler.listenToEvent('Mouse Wheel', onMouseWheel) + + thisObject.lenghtPercentage = window.localStorage.getItem(MODULE_NAME) + if (!thisObject.lenghtPercentage) { thisObject.lenghtPercentage = LENGHT_PERCENTAGE_DEFAULT_VALUE } + + event.lenghtPercentage = thisObject.lenghtPercentage + thisObject.container.eventHandler.raiseEvent('Lenght Percentage Changed', event) } function onMouseWheel (event) { @@ -45,8 +52,11 @@ function newTimeScale () { thisObject.lenghtPercentage = thisObject.lenghtPercentage + STEP_SIZE if (thisObject.lenghtPercentage > 100) { thisObject.lenghtPercentage = 100 } } + event.lenghtPercentage = thisObject.lenghtPercentage thisObject.container.eventHandler.raiseEvent('Lenght Percentage Changed', event) + + window.localStorage.setItem(MODULE_NAME, thisObject.lenghtPercentage) } function getContainer (point) { diff --git a/TimeMachine.js b/TimeMachine.js index 1d6a040ec..1dcbaf300 100644 --- a/TimeMachine.js +++ b/TimeMachine.js @@ -67,24 +67,6 @@ function newTimeMachine () { controlPanelHandle = canvas.panelsSpace.createNewPanel('Time Control Panel', undefined, panelOwner) let controlPanel = canvas.panelsSpace.getPanel(controlPanelHandle, panelOwner) - /* Each Time Machine has a Time Scale. */ - - timeScale = newTimeScale() - timeScale.initialize() - - timeScale.container.eventHandler.listenToEvent('Lenght Percentage Changed', function (event) { - thisObject.container.frame.width = TIME_MACHINE_WIDTH * event.lenghtPercentage / 100 - thisObject.container.eventHandler.raiseEvent('Dimmensions Changed', event) - }) - - rigthScale = newRigthScale() - rigthScale.initialize() - - rigthScale.container.eventHandler.listenToEvent('Height Percentage Changed', function (event) { - thisObject.container.frame.height = TIME_MACHINE_HEIGHT * event.heightPercentage / 100 - thisObject.container.eventHandler.raiseEvent('Dimmensions Changed', event) - }) - /* First, we initialize the market that we are going to show first on screen. Later all the other markets will be initialized on the background. */ let position = 0 // This defines the position of each chart respect to each other. @@ -103,11 +85,7 @@ function newTimeMachine () { timelineChart.initialize(DEFAULT_EXCHANGE, DEFAULT_MARKET, onDefaultInitialized) function onDefaultInitialized (err) { - if (INFO_LOG === true) { logger.write('[INFO] initialize -> onDefaultInitialized -> Entering function.') } - if (err.result !== GLOBAL.DEFAULT_OK_RESPONSE.result) { - if (INFO_LOG === true) { logger.write('[INFO] initialize -> onDefaultInitialized -> Initialization of the only market failed.') } - callBackFunction(err) return } @@ -117,6 +95,26 @@ function newTimeMachine () { controlPanel.container.eventHandler.listenToEvent('Datetime Changed', timelineChart.setDatetime, undefined) timelineChart.container.eventHandler.listenToEvent('Datetime Changed', controlPanel.setDatetime) + /* Each Time Machine has a Time Scale and a Right Scale. */ + + timeScale = newTimeScale() + + timeScale.container.eventHandler.listenToEvent('Lenght Percentage Changed', function (event) { + thisObject.container.frame.width = TIME_MACHINE_WIDTH * event.lenghtPercentage / 100 + thisObject.container.eventHandler.raiseEvent('Dimmensions Changed', event) + }) + + timeScale.initialize() + + rigthScale = newRigthScale() + + rigthScale.container.eventHandler.listenToEvent('Height Percentage Changed', function (event) { + thisObject.container.frame.height = TIME_MACHINE_HEIGHT * event.heightPercentage / 100 + thisObject.container.eventHandler.raiseEvent('Dimmensions Changed', event) + }) + + rigthScale.initialize() + initializeTheRest() } @@ -195,24 +193,28 @@ function newTimeMachine () { chart.draw() } - timeScale.draw() - rigthScale.draw() + if (timeScale !== undefined) { timeScale.draw() } + if (rigthScale !== undefined) { rigthScale.draw() } } function getContainer (point, purpose) { let container - container = timeScale.getContainer(point) - if (container !== undefined) { - if (container.isForThisPurpose(purpose)) { - return container + if (timeScale !== undefined) { + container = timeScale.getContainer(point) + if (container !== undefined) { + if (container.isForThisPurpose(purpose)) { + return container + } } } - container = rigthScale.getContainer(point) - if (container !== undefined) { - if (container.isForThisPurpose(purpose)) { - return container + if (rigthScale !== undefined) { + container = rigthScale.getContainer(point) + if (container !== undefined) { + if (container.isForThisPurpose(purpose)) { + return container + } } } From f0b8c8dbc6b021ef76d2677a16263cf7c778505c Mon Sep 17 00:00:00 2001 From: Luis Fernando Molina Date: Thu, 11 Apr 2019 11:56:23 +0200 Subject: [PATCH 06/11] Rigth Scale saving state to storage --- Scales/RightScale.js | 13 +++++++++++++ Scales/TimeScale.js | 6 +++++- 2 files changed, 18 insertions(+), 1 deletion(-) diff --git a/Scales/RightScale.js b/Scales/RightScale.js index 08277c02a..de5e716b5 100644 --- a/Scales/RightScale.js +++ b/Scales/RightScale.js @@ -14,6 +14,7 @@ heightPercentage: 100 } + const HEIGHT_PERCENTAGE_DEFAULT_VALUE = 50 const RIGHT_MARGIN = 50 const STEP_SIZE = 5 @@ -34,6 +35,16 @@ function initialize () { thisObject.container.eventHandler.listenToEvent('Mouse Wheel', onMouseWheel) + + thisObject.heightPercentage = window.localStorage.getItem(MODULE_NAME) + if (!thisObject.heightPercentage) { + thisObject.heightPercentage = HEIGHT_PERCENTAGE_DEFAULT_VALUE + } else { + thisObject.heightPercentage = JSON.parse(thisObject.heightPercentage) + } + + event.heightPercentage = thisObject.heightPercentage + thisObject.container.eventHandler.raiseEvent('Height Percentage Changed', event) } function onMouseWheel (event) { @@ -47,6 +58,8 @@ } event.heightPercentage = thisObject.heightPercentage thisObject.container.eventHandler.raiseEvent('Height Percentage Changed', event) + + window.localStorage.setItem(MODULE_NAME, thisObject.heightPercentage) } function getContainer (point) { diff --git a/Scales/TimeScale.js b/Scales/TimeScale.js index 0e2e62417..be3cc9232 100644 --- a/Scales/TimeScale.js +++ b/Scales/TimeScale.js @@ -37,7 +37,11 @@ function newTimeScale () { thisObject.container.eventHandler.listenToEvent('Mouse Wheel', onMouseWheel) thisObject.lenghtPercentage = window.localStorage.getItem(MODULE_NAME) - if (!thisObject.lenghtPercentage) { thisObject.lenghtPercentage = LENGHT_PERCENTAGE_DEFAULT_VALUE } + if (!thisObject.lenghtPercentage) { + thisObject.lenghtPercentage = LENGHT_PERCENTAGE_DEFAULT_VALUE + } else { + thisObject.lenghtPercentage = JSON.parse(thisObject.lenghtPercentage) + } event.lenghtPercentage = thisObject.lenghtPercentage thisObject.container.eventHandler.raiseEvent('Lenght Percentage Changed', event) From b3d17813df723caca765714d689ca8fe24a8b6e5 Mon Sep 17 00:00:00 2001 From: Luis Fernando Molina Date: Thu, 11 Apr 2019 12:12:41 +0200 Subject: [PATCH 07/11] Chart Aspect Ratio Button and functionality eliminated --- BottomSpace/ChartAspectRatio.js | 115 -------------------------------- PlottersManager.js | 30 --------- Scales/ChartGrid.js | 2 +- Spaces/BottomSpace.js | 10 --- Spaces/ChartSpace.js | 6 -- TimeMachine.js | 2 +- TimelineChart.js | 7 -- 7 files changed, 2 insertions(+), 170 deletions(-) delete mode 100644 BottomSpace/ChartAspectRatio.js diff --git a/BottomSpace/ChartAspectRatio.js b/BottomSpace/ChartAspectRatio.js deleted file mode 100644 index 599fb97d2..000000000 --- a/BottomSpace/ChartAspectRatio.js +++ /dev/null @@ -1,115 +0,0 @@ - function newChartAspectRatio () { - let thisObject = { - aspectRatio: undefined, - draw: draw, - getContainer: getContainer, - initialize: initialize - } - - let container = newContainer() - container.initialize() - thisObject.container = container - - thisObject.container.frame.width = 50 - thisObject.container.frame.height = BOTTOM_SPACE_HEIGHT - - resize() - - container.isDraggeable = false - container.isClickeable = false - container.isWheelable = true - - thisObject.aspectRatio = {} - - const INITIAL_Y_ASPECT_RATIO = 5 / 10 - const MIN_Y_ASPECT_RATIO = 1 / 10 - const MAX_Y_ASPECT_RATIO = 10 / 10 - - thisObject.aspectRatio.x = 1 - thisObject.aspectRatio.y = INITIAL_Y_ASPECT_RATIO - - canDrawIcon = false - - return thisObject - - function initialize () { - icon = new Image() - - icon.onload = onImageLoad - - function onImageLoad () { - canDrawIcon = true - } - - icon.src = window.canvasApp.urlPrefix + 'Images/Icons/chart-scale.png' - - thisObject.container.eventHandler.listenToEvent('Mouse Wheel', onMouseWheel) - - window.canvasApp.eventHandler.listenToEvent('Browser Resized', resize) - } - - function resize () { - container.frame.position.x = viewPort.visibleArea.topRight.x - thisObject.container.frame.width - container.frame.position.y = viewPort.visibleArea.bottomLeft.y - } - - function onMouseWheel (event) { - delta = event.wheelDelta - - if (viewPort.isMinZoom() === false) { return } // We only make this button to work at the min zoom level. - - if (delta < 0) { - delta = -0.1 - } else { - delta = 0.1 - } - - thisObject.aspectRatio.y = thisObject.aspectRatio.y + delta - thisObject.aspectRatio.y = Math.round(thisObject.aspectRatio.y * 100) / 100 - - if (thisObject.aspectRatio.y < MIN_Y_ASPECT_RATIO) { - thisObject.aspectRatio.y = MIN_Y_ASPECT_RATIO - } - - if (thisObject.aspectRatio.y > MAX_Y_ASPECT_RATIO) { - thisObject.aspectRatio.y = MAX_Y_ASPECT_RATIO - } - - thisObject.container.eventHandler.raiseEvent('Chart Aspect Ratio Changed', thisObject.aspectRatio) - } - - function getContainer (point) { - let container - - /* First we check if this point is inside this object UI. */ - - if (thisObject.container.frame.isThisPointHere(point, true) === true) { - return this.container - } else { - /* This point does not belong to this space. */ - - return undefined - } - } - - function draw () { - thisObject.container.frame.draw(false, false) - - if (canDrawIcon === false) { return } - if (viewPort.isMinZoom() === false) { return } // We only show this button at the min zoom level. - - let breakpointsHeight = 15 - - let imageHeight = 15 - let imageWidth = 15 - - let imagePoint = { - x: 10, - y: thisObject.container.frame.height / 2 - imageHeight / 2 + breakpointsHeight - } - - imagePoint = thisObject.container.frame.frameThisPoint(imagePoint) - - browserCanvasContext.drawImage(icon, imagePoint.x, imagePoint.y, imageWidth, imageHeight) - } - } diff --git a/PlottersManager.js b/PlottersManager.js index bb4760a88..b73fbc704 100644 --- a/PlottersManager.js +++ b/PlottersManager.js @@ -111,36 +111,6 @@ function newPlottersManager () { initializeCompetitionPlotters(onCompetitionPlottersInitialized) - canvas.bottomSpace.chartAspectRatio.container.eventHandler.listenToEvent('Chart Aspect Ratio Changed', onAspectRatioChanged) - - function onAspectRatioChanged (pAspectRatio) { - thisObject.container.frame.height = TIME_MACHINE_HEIGHT * pAspectRatio.y - - /* First the Product Plotters. */ - - for (let i = 0; i < productPlotters.length; i++) { - let productPlotter = productPlotters[i] - productPlotter.plotter.container.frame.width = thisObject.container.frame.width - productPlotter.plotter.container.frame.height = thisObject.container.frame.height - - if (productPlotter.plotter.recalculateScale !== undefined) { - productPlotter.plotter.recalculateScale() - } - } - - /* Then the competition plotters. */ - - for (let i = 0; i < competitionPlotters.length; i++) { - let competitionPlotter = competitionPlotters[i] - competitionPlotter.plotter.container.frame.width = thisObject.container.frame.width - competitionPlotter.plotter.container.frame.height = thisObject.container.frame.height - - if (competitionPlotter.plotter.recalculateScale !== undefined) { - competitionPlotter.plotter.recalculateScale() - } - } - } - function onCompetitionPlottersInitialized (err) { try { if (INFO_LOG === true) { logger.write('[INFO] initialize -> onCompetitionPlottersInitialized -> Entering function.') } diff --git a/Scales/ChartGrid.js b/Scales/ChartGrid.js index 86aa268ee..3ceb3bd35 100644 --- a/Scales/ChartGrid.js +++ b/Scales/ChartGrid.js @@ -55,7 +55,7 @@ const basePeriod = { x: 8 * 60 * 60 * 1000, - y: timeLineCoordinateSystem.max.y / 1000 / canvas.bottomSpace.chartAspectRatio.aspectRatio.y + y: timeLineCoordinateSystem.max.y / 1000 } let period = { diff --git a/Spaces/BottomSpace.js b/Spaces/BottomSpace.js index 6a206873c..9121a5356 100644 --- a/Spaces/BottomSpace.js +++ b/Spaces/BottomSpace.js @@ -2,7 +2,6 @@ function newBottomSpace () { var thisObject = { deleteTradingHistory: undefined, - chartAspectRatio: undefined, container: undefined, draw: draw, getContainer: getContainer, // returns the inner most container that holds the point received by parameter. @@ -23,9 +22,6 @@ function newBottomSpace () { thisObject.deleteTradingHistory = newDeleteTradingHistory() thisObject.deleteTradingHistory.initialize() - thisObject.chartAspectRatio = newChartAspectRatio() - thisObject.chartAspectRatio.initialize() - window.canvasApp.eventHandler.listenToEvent('Browser Resized', resize) } @@ -43,11 +39,6 @@ function newBottomSpace () { container = thisObject.deleteTradingHistory.getContainer(point) if (container !== undefined) { return container } - container = thisObject.chartAspectRatio.getContainer(point) - if (container !== undefined) { return container } - - /* The point does not belong to any inner container, so we return the current container. */ - return thisObject.container } @@ -56,7 +47,6 @@ function newBottomSpace () { drawBackground() thisObject.deleteTradingHistory.draw() - thisObject.chartAspectRatio.draw() } function drawBackground () { diff --git a/Spaces/ChartSpace.js b/Spaces/ChartSpace.js index 2486cb0a7..80b0c838e 100644 --- a/Spaces/ChartSpace.js +++ b/Spaces/ChartSpace.js @@ -25,13 +25,7 @@ function newChartSpace () { thisObject.container = newContainer() thisObject.container.initialize(MODULE_NAME) -/* - thisObject.container.frame.width = TIME_MACHINE_WIDTH - thisObject.container.frame.height = TIME_MACHINE_HEIGHT * canvas.bottomSpace.chartAspectRatio.aspectRatio.y - thisObject.container.frame.position.x = browserCanvas.width / 2 - thisObject.container.frame.width / 2 - thisObject.container.frame.position.y = browserCanvas.height / 2 - thisObject.container.frame.height / 2 -*/ thisObject.container.isDraggeable = false return thisObject diff --git a/TimeMachine.js b/TimeMachine.js index 1dcbaf300..75e11f84a 100644 --- a/TimeMachine.js +++ b/TimeMachine.js @@ -31,7 +31,7 @@ function newTimeMachine () { thisObject.container.detectMouseOver = true thisObject.container.frame.width = TIME_MACHINE_WIDTH - thisObject.container.frame.height = TIME_MACHINE_HEIGHT * canvas.bottomSpace.chartAspectRatio.aspectRatio.y + thisObject.container.frame.height = TIME_MACHINE_HEIGHT thisObject.container.frame.position.x = browserCanvas.width / 2 - TIME_MACHINE_WIDTH / 2 thisObject.container.frame.position.y = browserCanvas.height / 2 - TIME_MACHINE_HEIGHT / 2 diff --git a/TimelineChart.js b/TimelineChart.js index de2ed5f5f..da21b21be 100644 --- a/TimelineChart.js +++ b/TimelineChart.js @@ -159,13 +159,6 @@ callBackFunction(GLOBAL.DEFAULT_OK_RESPONSE) return } - - canvas.bottomSpace.chartAspectRatio.container.eventHandler.listenToEvent('Chart Aspect Ratio Changed', onAspectRatioChanged) - - function onAspectRatioChanged (pAspectRatio) { - thisObject.container.frame.height = TIME_MACHINE_HEIGHT * pAspectRatio.y - recalculateScale() - } } catch (err) { if (ERROR_LOG === true) { logger.write('[ERROR] initialize -> err = ' + err.stack) } callBackFunction(GLOBAL.DEFAULT_FAIL_RESPONSE) From 6f93a6918dc08efb1bc4809bb8b5a0eae86ef255 Mon Sep 17 00:00:00 2001 From: Luis Fernando Molina Date: Thu, 11 Apr 2019 13:32:57 +0200 Subject: [PATCH 08/11] Allowinf anonymous functions as event handlers --- EventHandler.js | 24 +++++++++++++++++++----- 1 file changed, 19 insertions(+), 5 deletions(-) diff --git a/EventHandler.js b/EventHandler.js index 9a242b190..89f100d9e 100644 --- a/EventHandler.js +++ b/EventHandler.js @@ -28,6 +28,10 @@ function newEventHandler () { } function stopListening (pEventType, pHandler) { + if (pHandler === undefined) { + pHandler = 'Anonymous Function' + } + if (thisObject.name !== undefined && CONSOLE_LOG === true) { console.log('Event Handler named ' + thisObject.name + ' received a request to stop listening to an the event ' + pEventType + ' with this handler: ' + pHandler) } @@ -37,14 +41,24 @@ function newEventHandler () { let eventType = record[0] let handler = record[1] - if (pEventType === eventType && pHandler.toString() === handler.toString()) { - eventHandlers.splice(i, 1) + if (pHandler === 'Anonymous Function') { + if (pEventType === eventType) { + eventHandlers.splice(i, 1) - if (thisObject.name !== undefined && CONSOLE_LOG === true) { - console.log('Evethandler found and deleted.') + if (thisObject.name !== undefined && CONSOLE_LOG === true) { + console.log('Evethandler found and deleted.') + } + return } + } else { + if (pEventType === eventType && pHandler.toString() === handler.toString()) { + eventHandlers.splice(i, 1) - return + if (thisObject.name !== undefined && CONSOLE_LOG === true) { + console.log('Evethandler found and deleted.') + } + return + } } } } From 68e8c96c85f6ee14678749cbc93a30c0d3b0d8d3 Mon Sep 17 00:00:00 2001 From: Luis Fernando Molina Date: Thu, 11 Apr 2019 17:18:35 +0200 Subject: [PATCH 09/11] Removing LRC --- Panels/ProductsPanel.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Panels/ProductsPanel.js b/Panels/ProductsPanel.js index 506460406..a6c97f8a5 100644 --- a/Panels/ProductsPanel.js +++ b/Panels/ProductsPanel.js @@ -76,7 +76,7 @@ let bot = devTeam.bots[j] if (bot.type !== 'Indicator' && bot.cloneId === undefined) { continue } - if (bot.type === 'Indicator' && (devTeam.codeName !== 'AAMasters' && devTeam.codeName !== 'AAVikings' && devTeam.codeName !== userTeam.slug)) { continue } + if (bot.type === 'Indicator' && (devTeam.codeName !== 'AAMasters' && devTeam.codeName !== userTeam.slug)) { continue } if (bot.products !== undefined) { for (let k = 0; k < bot.products.length; k++) { From 44fce4fbc57e8aba6999c2595e3c1c9d9bfcd635 Mon Sep 17 00:00:00 2001 From: Luis Fernando Molina Date: Thu, 11 Apr 2019 21:23:25 +0200 Subject: [PATCH 10/11] MouseOver event into Right Scale working --- Scales/RightScale.js | 44 ++++++++++++++++++++++++++++++++++++++++++++ TimeMachine.js | 4 ++-- 2 files changed, 46 insertions(+), 2 deletions(-) diff --git a/Scales/RightScale.js b/Scales/RightScale.js index de5e716b5..bd7ecc144 100644 --- a/Scales/RightScale.js +++ b/Scales/RightScale.js @@ -31,6 +31,13 @@ thisObject.container.isClickeable = false thisObject.container.isWheelable = true + let mouse = { + position: { + x: 0, + y: 0 + } + } + return thisObject function initialize () { @@ -45,6 +52,11 @@ event.heightPercentage = thisObject.heightPercentage thisObject.container.eventHandler.raiseEvent('Height Percentage Changed', event) + + thisObject.container.eventHandler.listenToEvent('onMouseOver', function (event) { + mouse.position.x = event.x + mouse.position.y = event.y + }) } function onMouseWheel (event) { @@ -78,6 +90,7 @@ function draw () { drawBackground() + drawLabel() } function drawBackground () { @@ -96,4 +109,35 @@ browserCanvasContext.fill() } + + function drawLabel () { + let label = '6000' + let fontSize = 10 + + let ratePoint = { + x: 0, + y: mouse.position.y + } + + // getRateFromPoint(ratePoint) + + let labelPoint = { + x: viewPort.visibleArea.topRight.x + 5, + y: mouse.position.y - fontSize / 2 + 1 + } + + let xOffset = 0// label.length / 2 * fontSize * FONT_ASPECT_RATIO + + browserCanvasContext.beginPath() + + browserCanvasContext.rect(labelPoint.x, labelPoint.y, xOffset * 2, fontSize) + browserCanvasContext.fillStyle = 'rgba(' + UI_COLOR.RUSTED_RED + ', 1)' + browserCanvasContext.fill() + + browserCanvasContext.closePath() + + browserCanvasContext.font = fontSize + 'px ' + UI_FONT.PRIMARY + browserCanvasContext.fillStyle = 'rgba(60, 60, 60, 0.50)' + browserCanvasContext.fillText(label, labelPoint.x, labelPoint.y) + } } diff --git a/TimeMachine.js b/TimeMachine.js index 75e11f84a..930f6177f 100644 --- a/TimeMachine.js +++ b/TimeMachine.js @@ -98,7 +98,7 @@ function newTimeMachine () { /* Each Time Machine has a Time Scale and a Right Scale. */ timeScale = newTimeScale() - + timeScale.container.connectToParent(thisObject.container, false, false) timeScale.container.eventHandler.listenToEvent('Lenght Percentage Changed', function (event) { thisObject.container.frame.width = TIME_MACHINE_WIDTH * event.lenghtPercentage / 100 thisObject.container.eventHandler.raiseEvent('Dimmensions Changed', event) @@ -107,7 +107,7 @@ function newTimeMachine () { timeScale.initialize() rigthScale = newRigthScale() - + rigthScale.container.connectToParent(thisObject.container, false, false) rigthScale.container.eventHandler.listenToEvent('Height Percentage Changed', function (event) { thisObject.container.frame.height = TIME_MACHINE_HEIGHT * event.heightPercentage / 100 thisObject.container.eventHandler.raiseEvent('Dimmensions Changed', event) From 116c050b62de88d488ea490ff2fa7857d55a9ee9 Mon Sep 17 00:00:00 2001 From: Luis Fernando Molina Date: Thu, 11 Apr 2019 21:31:58 +0200 Subject: [PATCH 11/11] Reverted this --- TimeMachine.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/TimeMachine.js b/TimeMachine.js index 930f6177f..75e11f84a 100644 --- a/TimeMachine.js +++ b/TimeMachine.js @@ -98,7 +98,7 @@ function newTimeMachine () { /* Each Time Machine has a Time Scale and a Right Scale. */ timeScale = newTimeScale() - timeScale.container.connectToParent(thisObject.container, false, false) + timeScale.container.eventHandler.listenToEvent('Lenght Percentage Changed', function (event) { thisObject.container.frame.width = TIME_MACHINE_WIDTH * event.lenghtPercentage / 100 thisObject.container.eventHandler.raiseEvent('Dimmensions Changed', event) @@ -107,7 +107,7 @@ function newTimeMachine () { timeScale.initialize() rigthScale = newRigthScale() - rigthScale.container.connectToParent(thisObject.container, false, false) + rigthScale.container.eventHandler.listenToEvent('Height Percentage Changed', function (event) { thisObject.container.frame.height = TIME_MACHINE_HEIGHT * event.heightPercentage / 100 thisObject.container.eventHandler.raiseEvent('Dimmensions Changed', event)