src/project/flourish-canvas.js

@@ -39,6 +39,12 @@ class FlourishCanvas extends Canvas {
 
     });
 
+    a.el.addEventListener('mouseout', function (e) {
+      a.XPos = -1;
+
+      a.Invalidate();
+    });
+
   }
 
   Invalidate() {
@@ -68,7 +74,6 @@ class FlourishCanvas extends Canvas {
     a.DrawVerticalLine(x, a.HeaderHeight, h, a.Options.HotTrackLine.Colour, { LineWidth: a.Options.HotTrackLine.Width });
   }
 
-
 }
 
 

src/project/gantt-chart-options.js

@@ -0,0 +1,58 @@
+class GanttChartOptions {
+  DayWidth = 24;
+  HeaderRow = {
+    Height: [ 20, 20 ]
+  };
+  Row = {
+    Height: 28,
+    BackColour: "rgba(235, 235, 235, 0.3)",
+    Task: {
+      Height: 14,
+      BorderColour: "#555555",
+      FillColour: "#D8EEDB"
+    },
+    OrphanTask: {
+      Height: 14,
+      BorderColour: "#555555",
+      FillColour: "#9CC2E6"
+    },
+    ChildTask: {
+      Height: 14,
+      BorderColour: "#555555",
+      FillColour: "#FFF5C1"
+    },
+    CollatedTask: {
+      Height: 6,
+      BorderColour: "#555555",
+      FillColour: "#555555"
+    }
+  };
+  Column = {
+    SatColour: "rgba(233, 237, 239, 0.8)",
+    SunColour: "rgba(233, 237, 239, 0.9)"
+  };
+  Line = {
+    Colour: "#555555",
+    Width: 1,
+    ArrowSize: 5
+  };
+  HotTrackLine = {
+    Colour: "#D04437",
+    Width: 1
+  };
+  DateFont = "7pt sans-serif";
+  DateForeColour = "#636363";
+  BorderWidth = 1;
+  BorderColour = "#B8B8B8";
+  BorderDashPattern = [1, 1];
+  EnableHotTracking = true;
+  MinimumRowCount = 6;
+  ShowDateLines = true;
+  ShowStartDayOfWeekLine = true;
+  ShowRowLines = true;
+  ShowRowStripes = true;
+
+}
+
+
+export default GanttChartOptions;

src/project/gantt-chart.js

@@ -1,3 +1,5 @@
+import GanttChartOptions from './gantt-chart-options.js';
+
 import CanvasContainer from '../references/canvas-container.js';
 import BackgroundCanvas from './background-canvas.js';
 import ForegroundCanvas from './foreground-canvas.js';
@@ -20,7 +22,7 @@ class GanttChart {
   constructor(el, options) {
     const a = this;
 
-    a.Options = Object.assign(a.DefaultOptions, options);
+    a.Options = Object.assign(new GanttChartOptions(), options);
     a.CanvasContainer = new CanvasContainer(el);
 
     a.#initialiseComponents();
@@ -61,63 +63,6 @@ class GanttChart {
   }
 
 
-  get DefaultOptions() {
-    return {
-      DayWidth: 24,
-      HeaderRow: {
-        Height: [ 20, 20 ]
-      },
-      Row: {
-        Height: 28,
-        BackColour: "rgba(235, 235, 235, 0.3)",
-        Task: {
-          Height: 14,
-          BorderColour: "#555555",
-          FillColour: "#D8EEDB"
-        },
-        OrphanTask: {
-          Height: 14,
-          BorderColour: "#555555",
-          FillColour: "#9CC2E6"
-        },
-        ChildTask: {
-          Height: 14,
-          BorderColour: "#555555",
-          FillColour: "#FFF5C1"
-        },
-        CollatedTask: {
-          Height: 6,
-          BorderColour: "#555555",
-          FillColour: "#555555"
-        }
-      },
-      Column: {
-        SatColour: "rgba(233, 237, 239, 0.8)",
-        SunColour: "rgba(233, 237, 239, 0.9)",
-      },
-      Line: {
-        Colour: "#555555",
-        Width: 1,
-        ArrowSize: 5
-      },
-      HotTrackLine: {
-        Colour: "#D04437",
-        Width: 1
-      },
-      DateFont: "7pt sans-serif",
-      DateForeColour: "#636363",
-      BorderWidth: 1,
-      BorderColour: "#B8B8B8",
-      BorderDashPattern: [1, 1],
-      EnableHotTracking: true,
-      MinimumRowCount: 6,
-      ShowDateLines: true,
-      ShowStartDayOfWeekLine: true,
-      ShowRowLines: true,
-      ShowRowStripes: true
-    };
-  }
-
   get HeaderHeight() {
     const a = this;
 
@@ -170,7 +115,10 @@ class GanttChart {
     const width = ((a.Duration + 2) * a.Options.DayWidth);
     const height = (Math.max(a.Tasks.length, a.Options.MinimumRowCount) * a.Options.Row.Height) + a.HeaderHeight;
 
-    a.CanvasContainer.Size = { W: width, H: height };
+    a.CanvasContainer.Size = {
+      W: width,
+      H: height
+    };
 
     a.CanvasContainer.Invalidate();
   }