Fixed bug when immobile bar is 0 pixels away from bar about to be dragged

Immobile bars also emit a mousedown event now (but they cannot be dragged)
Started working on special "shadow" bars
Updated NPM package version

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue-ganttastic",
-  "version": "0.9.14",
+  "version": "0.9.15",
   "description": "A simple and customizable Gantt chart component for Vue.js",
   "repository": {
     "type": "git",

src/GGanttBar.vue

@@ -107,7 +107,14 @@ export default {
     },
 
     barConfig(){
-      return this.bar.ganttBarConfig || {}
+      if(this.bar.ganttBarConfig) {
+        return {
+          ...this.bar.ganttBarConfig,
+          background: this.bar.ganttBarConfig.isShadow ? "grey" : this.bar.ganttBarConfig.background || this.bar.ganttBarConfig.backgroundColor,
+          opacity: this.bar.ganttBarConfig.isShadow ? "0.3" : this.bar.ganttBarConfig.opacity
+        }
+      }
+      return {}
     },
 
     barStyle(){ 
@@ -168,17 +175,19 @@ export default {
 
     onMousedown(e){
       e.preventDefault()
-      if(e.button === 2 || this.barConfig.immobile){
+      if(e.button === 2){
         return
       }
-      this.setDragLimitsOfGanttBar(this)
+      if(!this.barConfig.immobile && !this.barConfig.isShadow) {
-      // initialize the dragging on next mousemove event:
+        this.setDragLimitsOfGanttBar(this)
-      window.addEventListener("mousemove", this.onFirstMousemove, {once: true})
+        // initialize the dragging on next mousemove event:
-      // if next mousemove happens after mouse up (if user just presses mouse button down, then up, without moving):
+        window.addEventListener("mousemove", this.onFirstMousemove, {once: true})
-      window.addEventListener("mouseup",
+        // if next mousemove happens after mouse up (if user just presses mouse button down, then up, without moving):
-        () => window.removeEventListener("mousemove", this.onFirstMousemove), 
+        window.addEventListener("mouseup",
-        {once: true}
+          () => window.removeEventListener("mousemove", this.onFirstMousemove), 
-      )
+          {once: true}
+        )
+      }
       this.onBarEvent(e, this)
     },
 

src/GGanttChart.vue

@@ -168,7 +168,7 @@ export default {
         return
       }
       for(let side of ["left", "right"]){
-        let [totalGapDistance, bundleBarsOnPath] = this.countGapDistanceToNextImmobileBar(bar, 0, side)
+        let [totalGapDistance, bundleBarsOnPath] = this.countGapDistanceToNextImmobileBar(bar, null, side, false)
         for(let i=0; i< bundleBarsOnPath.length; i++){
           let barFromBundle = bundleBarsOnPath[i].bar
           let gapDist = bundleBarsOnPath[i].gapDistance
@@ -185,9 +185,9 @@ export default {
             })
           })
         }
-        if(totalGapDistance && side === "left"){
+        if(totalGapDistance != null && side === "left"){
           bar.dragLimitLeft = bar.$refs['g-gantt-bar'].offsetLeft -  totalGapDistance
-        } else if(totalGapDistance && side === "right"){
+        } else if(totalGapDistance != null && side === "right"){
           bar.dragLimitRight = bar.$refs['g-gantt-bar'].offsetLeft+ bar.$refs['g-gantt-bar'].offsetWidth + totalGapDistance
         }
       }
@@ -202,7 +202,7 @@ export default {
     // returns the gap distance to the next immobile bar
     // in the row where the given bar (parameter) is (added to gapDistanceSoFar)
     // and a list of all bars on that path that belong to a bundle
-    countGapDistanceToNextImmobileBar(bar, gapDistanceSoFar, side="left"){
+    countGapDistanceToNextImmobileBar(bar, gapDistanceSoFar, side="left", ignoreShadows = true){
       let bundleBarsAndGapDist = bar.barConfig.bundle ? [{bar, gapDistance: gapDistanceSoFar}] : []
       let currentBar = bar
       let nextBar = this.getNextGanttBar(currentBar, side)
@@ -211,7 +211,7 @@ export default {
         while(nextBar){
           let nextBarOffsetRight = nextBar.$refs['g-gantt-bar'].offsetLeft + nextBar.$refs['g-gantt-bar'].offsetWidth
           gapDistanceSoFar += currentBar.$refs['g-gantt-bar'].offsetLeft - nextBarOffsetRight
-          if(nextBar.barConfig.immobile){
+          if(nextBar.barConfig.immobile || (nextBar.barConfig.isShadow && !ignoreShadows)){
             return [gapDistanceSoFar, bundleBarsAndGapDist]
           } else if(nextBar.barConfig.bundle){
             bundleBarsAndGapDist.push({bar: nextBar, gapDistance: gapDistanceSoFar})