diff --git a/Container.js b/Container.js index 442957f08..8ea75ce14 100644 --- a/Container.js +++ b/Container.js @@ -45,6 +45,7 @@ function newContainer () { thisObject.parentContainer = parentContainer thisObject.parentContainer.eventHandler.listenToEvent('Dimmensions Changed', onParentDimmensionsChanged) thisObject.parentContainer.eventHandler.listenToEvent('onMouseOver', onMouseOver) + thisObject.parentContainer.eventHandler.listenToEvent('onMouseNotOver', onMouseNotOver) if (connectedToParentWidth) { thisObject.frame.width = thisObject.parentContainer.frame.width @@ -74,6 +75,10 @@ function newContainer () { thisObject.eventHandler.raiseEvent('onMouseOver', event) } + function onMouseNotOver (event) { + thisObject.eventHandler.raiseEvent('onMouseNotOver', event) + } + function isForThisPurpose (purpose) { if (purpose !== undefined) { switch (purpose) { diff --git a/Scales/TimeScale.js b/Scales/TimeScale.js index 63ca86c28..9b5c2b8fb 100644 --- a/Scales/TimeScale.js +++ b/Scales/TimeScale.js @@ -33,6 +33,8 @@ function newTimeScale () { } } + let visible = false + return thisObject function initialize () { @@ -52,6 +54,12 @@ function newTimeScale () { thisObject.container.eventHandler.listenToEvent('onMouseOver', function (event) { mouse.position.x = event.x mouse.position.y = event.y + + visible = true + }) + + thisObject.container.eventHandler.listenToEvent('onMouseNotOver', function (event) { + visible = false }) } @@ -92,6 +100,8 @@ function newTimeScale () { } function draw () { + if (visible === false) { return } + /* We need this scale to match the shape of its parent when the parent is inside the viewPort, when it is not, we need the scale still to be visible at the top of the viewPort. */ @@ -175,16 +185,17 @@ to be visible at the top of the viewPort. */ let xOffset = label.length * fontSize * FONT_ASPECT_RATIO - browserCanvasContext.beginPath() - - browserCanvasContext.rect(point.x - xOffset / 2, point.y, xOffset, fontSize + 2) - 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, point.x - xOffset / 2, point.y + fontSize + 2) +/* + browserCanvasContext.beginPath() + + browserCanvasContext.rect(point.x - xOffset / 2, point.y, xOffset, fontSize + 2) + browserCanvasContext.fillStyle = 'rgba(' + UI_COLOR.WHITE + ', 1)' + browserCanvasContext.fill() + + browserCanvasContext.closePath() + */ } } diff --git a/TimeMachine.js b/TimeMachine.js index 4a3cbf44c..20493e52f 100644 --- a/TimeMachine.js +++ b/TimeMachine.js @@ -244,6 +244,9 @@ function newTimeMachine () { if (thisObject.container.frame.isThisPointHere(point) === true) { return thisObject.container } else { + if (purpose === GET_CONTAINER_PURPOSE.MOUSE_OVER) { + thisObject.container.eventHandler.raiseEvent('onMouseNotOver') + } return } }