Drag with snapping

TimeMachine.js

@@ -1,4 +1,4 @@
- /*
+/*
 
 Markets are a function of time. When watching them, end users must be positioned at one particular point in time. The system currently allows users
 to position themselves at any time they like.
@@ -37,7 +37,7 @@ function newTimeMachine () {
   thisObject.container.frame.position.y = browserCanvas.height / 2 - TIME_MACHINE_HEIGHT / 2
 
   let controlPanelHandle             // We need this to destroy the Panel when this object is itself destroyed or no longer needs it...
-                                    // ... also to request a reference to the object for the cases we need it.
+                                   // ... also to request a reference to the object for the cases we need it.
   const SEPARATION_BETWEEN_TIMELINE_CHARTS = 1.5
 
   let timeScale
@@ -63,7 +63,7 @@ function newTimeMachine () {
   function initialize (callBackFunction) {
     if (INFO_LOG === true) { logger.write('[INFO] initialize -> Entering function.') }
 
-      /* Each Time Machine has a Control Panel. */
+     /* Each Time Machine has a Control Panel. */
 
     let panelOwner = 'Global'
     controlPanelHandle = canvas.panelsSpace.createNewPanel('Time Control Panel', undefined, panelOwner)
@@ -76,7 +76,7 @@ function newTimeMachine () {
       moveToUserPosition(thisObject.container, timeLineCoordinateSystem, false, false, event.mousePosition)
     })
 
-      /* 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. */
+     /* 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,7 +103,7 @@ 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. */
+     /* Each Time Machine has a Time Scale and a Right Scale. */
 
       timeScale = newTimeScale()
       timeScale.container.connectToParent(thisObject.container, false, false, false, true, true, true)
@@ -143,10 +143,10 @@ function newTimeMachine () {
           let market = SUPPORTED_MARKETS[j]
 
           if (
-            exchange === DEFAULT_EXCHANGE &&
-            market.assetA === DEFAULT_MARKET.assetA &&
-            market.assetB === DEFAULT_MARKET.assetB
-          ) { continue }
+           exchange === DEFAULT_EXCHANGE &&
+           market.assetA === DEFAULT_MARKET.assetA &&
+           market.assetB === DEFAULT_MARKET.assetB
+         ) { continue }
 
           initializeTimelineChart(exchange, market)
         }
@@ -203,7 +203,7 @@ function newTimeMachine () {
       if (timeScale !== undefined) { timeScale.draw() }
       if (rigthScale !== undefined) { rigthScale.draw() }
 
-      // thisObject.container.frame.draw(false, true, false)
+     // thisObject.container.frame.draw(false, true, false)
     }
   }
 
@@ -237,7 +237,7 @@ function newTimeMachine () {
       }
     }
 
-    if (thisObject.container.frame.isThisPointHere(point) === true) {
+    if (thisObject.container.frame.isThisPointHere(point, true) === true) {
       return thisObject.container
     } else {
       if (purpose === GET_CONTAINER_PURPOSE.MOUSE_OVER) {
@@ -261,10 +261,11 @@ function newTimeMachine () {
     }
 
     timeLineCoordinateSystem.initialize(
-           minValue,
-           maxValue,
-           thisObject.container.frame.width,
-           thisObject.container.frame.height
-       )
+          minValue,
+          maxValue,
+          thisObject.container.frame.width,
+          thisObject.container.frame.height
+      )
   }
 }
+