Feature: delete dependencies

Double click dependencies to delete them.

src/main.css

@@ -204,15 +204,19 @@ body {
 }
 
 /* dependencies */
+.dependency {
+    stroke-width: 3;
+    stroke: hsl(240, 50%, 85%);
+}
+.dependency:hover {
+    stroke-width: 6;
+}
 .dependencyLine {
     fill: none;
-    stroke: hsl(240, 50%, 80%);
-    stroke-width: 2;
 }
 
 .dependencyArrow {
     fill: hsl(240, 50%, 80%);
-    stroke: none;
 }
 
 
@@ -275,3 +279,13 @@ body {
 }
 
 
+
+/* style types */
+.transparentLine {
+    fill: none;
+    stroke: rgba(0, 0, 0, 0%);
+}
+
+.thick {
+    stroke-width: 8px;
+}

src/milestoneMap.js

@@ -23,7 +23,7 @@ var MilestoneMap = function (obj, pagesize) {
     this.elemContainer = Draw.elem ("div", {
         "class": "mMapContainer"
     }, this.elemContaine);
-    //this.elemContainer.addEventListener("click", this.deactivateOnUnclick.bind(this));
+    this.elemContainer.addEventListener("click", this.deactivateOnUnclick.bind(this));
 
     this.printElem = Draw.elem("span", {
         "class": "printablePages"
@@ -239,6 +239,17 @@ MilestoneMap.prototype.drawDependencies = function () {
     });
 };
 
+MilestoneMap.prototype.deactivateOnUnclick = function () {
+    if (this.globalModeSet) {
+        this.globalModeSet = false;
+    }
+    else {
+        this.globalMode = MilestoneMap.SELECT;
+        this.globalData = null;
+    }
+};
+
+MilestoneMap.SPACEFORFIRSTPROJECT = 35;
 MilestoneMap.prototype.reflow = function () {
     var headerHeight = Draw.verticalReflow (this.dateHeader.endy, [this.businessMs]);
     this.elemFixed.setAttribute("height", headerHeight);
@@ -247,7 +258,7 @@ MilestoneMap.prototype.reflow = function () {
     this.scrollbox.setAttribute("style", "max-height:" + bodyHeight + "px;");
     bodyHeight -= 4;
 
-    var mainHeight = Draw.verticalReflow (0, this.programmes);
+    var mainHeight = Draw.verticalReflow (MilestoneMap.SPACEFORFIRSTPROJECT, this.programmes);
     mainHeight = mainHeight < bodyHeight ? bodyHeight : mainHeight;
     this.elemMain.setAttribute("height", mainHeight);
 

src/milestoneMap/dependency.js

@@ -10,8 +10,10 @@ var Dependency = function (obj, index, mMap) {
     this.elem = Draw.svgElem("g", {
         "class": "dependency"
     });
+    this.elem.addEventListener("dblclick", this.deleteDraw.bind(this));
 
     // model
+    this.selected = false;
     this.index = index;
     this.mMap = mMap;
 
@@ -56,7 +58,8 @@ Dependency.prototype.save = function () {
 
 Dependency.prototype.draw = function () {
     this.elem.innerHTML = "";
-
+
+    // TODO: somehow draw and signify milestones that are off the sides of the page.
     if (this.report !== this.mMap.currReport ||
         !this.dependent.isDrawable() || !this.dependency.isDrawable())
     {
@@ -68,16 +71,20 @@ Dependency.prototype.draw = function () {
     var end = Draw.getElemXY(this.dependent.elem);
     end.x -=  MsAtReport.DIAMONDSIZE;
 
-    var line = Draw.quadrupleAngledLine (
+    Draw.quadrupleAngledLine (
         start, end, Dependency.HSPACE, Dependency.VSPACE, "dependencyLine",
         this.elem);
 
+    Draw.quadrupleAngledLine (
+        start, end, Dependency.HSPACE, Dependency.VSPACE, "thick transparentLine",
+        this.elem);
+
     Draw.svgElem ("path", {
         "class": "dependencyArrow",
-        "d": "M -6 -6 L -6 6 L 0 0 Z",
+        "d": "M -4 -4 L -4 4 L 0 0 Z",
         "transform": "translate("+ end.x + ", " + end.y + ")"
-    }, this.elem);
-};
+    }, this.elem);    
+}
 
 // modifications
 Dependency.prototype.deleteThis = function () {

src/milestoneMap/milestoneTD.js

@@ -25,7 +25,7 @@ MilestoneTD.HEIGHT = 35;
 MilestoneTD.TEXTBOXHEIGHT = 45;
 MilestoneTD.YOFFSET = 55;
 MilestoneTD.XOFFSET = 5;
-MilestoneTD.HEIGHTWIDTHRATIO = 6;
+MilestoneTD.HEIGHTWIDTHRATIO = 7;
 MilestoneTD.MAXTEXTLENGTH = 100;
 MilestoneTD.prototype.restore = function (title, date, comment) {
     this.title = title;

src/util.js

@@ -49,14 +49,17 @@ Util.refreshIndices = function (arr) {
         arr[i].index = i;
     }
 };
-Util.isSortedByIndex = function (arr) {
+Util.isStrictlySorted = function (arr, cmpFunc) {
     for (var i = 0; i < arr.length - 1; i++) {
-        if (arr[i].index < arr[i + 1]) {
+        if (cmpFunc(arr[i], arr[i + 1]) > 0) {
             return false;
         }
     }
     return true;
 };
+Util.isSortedByIndex = function (arr) {
+    return Util.isSorted (arr, (a, b) => a.index - b.index);
+};
 Util.addToIndexedArray = function (arr, obj, index) {
     assert (() => index <= arr.length);
     assert (() => index >= 0);