Final adjustments to viewport changes

Globals.js

@@ -147,7 +147,7 @@ let NEW_SESSION_INITIAL_DATE = new Date();  // This value will be overwritten at
 
 let maxDate = new Date();
 maxDate.setMilliseconds(0);
-maxDate.setDate(maxDate.getDate() + 365 * 4);  // We might have charts that projects data into the future. 
+maxDate.setDate(maxDate.getDate() + 365 * 1);  // We might have charts that projects data into the future. 
 
 const MIN_PLOTABLE_DATE = new Date(2015, 0, 1, 0, 0, 0);
 const MAX_PLOTABLE_DATE = maxDate;

TimeMachine.js

@@ -205,7 +205,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)
   }
 
   function getContainer (point, purpose) {

ViewPort.js

@@ -358,8 +358,8 @@ function newViewPort () {
 
     let CROSS_SIZE = 5
 
-    for (var i = startingX; i < thisObject.visibleArea.bottomRight.x; i = i + squareWidth) {
-      for (var j = startingY; j < thisObject.visibleArea.bottomRight.y; j = j + squareWidth) {
+    for (var i = startingX; i < thisObject.visibleArea.bottomRight.x + RIGHT_MARGIN; i = i + squareWidth) {
+      for (var j = startingY; j < thisObject.visibleArea.bottomRight.y + BOTTOM_MARGIN; j = j + squareWidth) {
         let point1 = {
           x: Math.trunc(i - CROSS_SIZE),
           y: Math.trunc(j)
@@ -388,7 +388,7 @@ function newViewPort () {
       }
     }
     browserCanvasContext.closePath()
-    browserCanvasContext.strokeStyle = 'rgba(150, 150, 150, 1)'
+    browserCanvasContext.strokeStyle = 'rgba(150, 150, 150, 0.5)'
 
     browserCanvasContext.lineWidth = 1