bugfix: mouse wheel didn't scroll the window when cursor was over Handsontable

Author: warpech

Diff for: CHANGELOG.md

@@ -2,6 +2,7 @@ Features:
 - initial release of Native Scrollbars feature (experimental, don't use yet)
 
 Bugfixes:
+- mouse wheel didn't scroll the window when cursor was over Handsontable ([#383](https://github.com/warpech/jquery-handsontable/issues/383), [#627](https://github.com/warpech/jquery-handsontable/issues/627))
 - methods `countVisibleRows` and `countVisibleCols` were broken since version 0.9.0
 - WalkontableDom.prototype.offset now returns offset relatively to the document also for position: fixed
 

Diff for: src/3rdparty/walkontable/src/table.js

@@ -527,4 +527,12 @@ WalkontableTable.prototype.isRowInViewport = function (r) {
 
 WalkontableTable.prototype.isColumnInViewport = function (c) {
   return (!this.isColumnBeforeViewport(c) && !this.isColumnAfterViewport(c));
+};
+
+WalkontableTable.prototype.isLastRowFullyVisible = function () {
+  return (this.getLastVisibleRow() === this.instance.getSetting('totalRows') - 1 && this.rowStrategy.remainingSize <= 0);
+};
+
+WalkontableTable.prototype.isLastColumnFullyVisible = function () {
+  return (this.getLastVisibleColumn() === this.instance.getSetting('totalColumns') - 1 && this.columnStrategy.remainingSize <= 0);
 };

Diff for: src/3rdparty/walkontable/src/wheel.js

@@ -1,29 +1,39 @@
 function WalkontableWheel(instance) {
-  var that = this;
-
-  //reference to instance
-  this.instance = instance;
-
   if (instance.getSetting('scrollbarModelV') === 'native' || instance.getSetting('scrollbarModelH') === 'native') {
     return;
   }
 
-  $(this.instance.wtTable.TABLE).on('mousewheel', function (event, delta, deltaX, deltaY) {
-    clearTimeout(that.instance.wheelTimeout);
-    that.instance.wheelTimeout = setTimeout(function () { //timeout is needed because with fast-wheel scrolling mousewheel event comes dozen times per second
+  $(instance.wtTable.TABLE).on('mousewheel', function (event, delta, deltaX, deltaY) {
+    if (deltaY > 0 && instance.getSetting('offsetRow') === 0) {
+      return; //attempt to scroll up when it's already showing first row
+    }
+    else if (deltaY < 0 && instance.wtTable.isLastRowFullyVisible()) {
+      return; //attempt to scroll down when it's already showing last row
+    }
+    else if (deltaX < 0 && instance.getSetting('offsetColumn') === 0) {
+      return; //attempt to scroll left when it's already showing first column
+    }
+    else if (deltaX > 0 && instance.wtTable.isLastColumnFullyVisible()) {
+      return; //attempt to scroll right when it's already showing last column
+    }
+
+    //now we are sure we really want to scroll
+    clearTimeout(instance.wheelTimeout);
+    instance.wheelTimeout = setTimeout(function () { //timeout is needed because with fast-wheel scrolling mousewheel event comes dozen times per second
       if (deltaY) {
         //ceil is needed because jquery-mousewheel reports fractional mousewheel deltas on touchpad scroll
         //see http://stackoverflow.com/questions/5527601/normalizing-mousewheel-speed-across-browsers
-        if (that.instance.wtScrollbars.vertical.visible) { // if we see scrollbar
-          that.instance.scrollVertical(-Math.ceil(deltaY)).draw();
+        if (instance.wtScrollbars.vertical.visible) { // if we see scrollbar
+          instance.scrollVertical(-Math.ceil(deltaY)).draw();
         }
       }
       else if (deltaX) {
-        if (that.instance.wtScrollbars.horizontal.visible) { // if we see scrollbar
-          that.instance.scrollHorizontal(Math.ceil(deltaX)).draw();
+        if (instance.wtScrollbars.horizontal.visible) { // if we see scrollbar
+          instance.scrollHorizontal(Math.ceil(deltaX)).draw();
         }
       }
     }, 0);
+
     event.preventDefault();
   });
 }

Diff for: src/3rdparty/walkontable/test/jasmine/spec/table.spec.js

@@ -781,4 +781,88 @@ describe('WalkontableTable', function () {
     expect(wtHider.outerWidth()).toBeGreaterThan(getTableWidth($table));
     expect(wtHider.find('tr:first td:last').width()).toEqual(wtHider.find('tr:first td:last').prev().width());
   });
+
+  describe('isLastRowFullyVisible', function () {
+    /*it('should be false because it is only partially visible', function () {
+      createDataArray(8, 4);
+
+      var wt = new Walkontable({
+        table: $table[0],
+        data: getData,
+        totalRows: getTotalRows,
+        totalColumns: getTotalColumns,
+        width: 185,
+        height: 185,
+        scrollH: 'auto',
+        scrollV: 'auto',
+        stretchH: 'hybrid'
+      });
+      wt.draw();
+
+      expect(wt.wtTable.isLastRowFullyVisible()).toEqual(false);
+    });*/
+
+    it('should be true because it is fully visible', function () {
+      createDataArray(8, 4);
+
+      var wt = new Walkontable({
+        table: $table[0],
+        data: getData,
+        totalRows: getTotalRows,
+        totalColumns: getTotalColumns,
+        width: 185,
+        height: 185,
+        scrollH: 'auto',
+        scrollV: 'auto',
+        stretchH: 'hybrid'
+      });
+      wt.draw();
+      wt.scrollVertical(1);
+      wt.draw();
+
+      expect(wt.wtTable.isLastRowFullyVisible()).toEqual(true);
+    });
+  });
+
+  describe('isLastColumnFullyVisible', function () {
+    it('should be false because it is only partially visible', function () {
+      createDataArray(18, 4);
+
+      var wt = new Walkontable({
+        table: $table[0],
+        data: getData,
+        totalRows: getTotalRows,
+        totalColumns: getTotalColumns,
+        width: 209,
+        height: 185,
+        scrollH: 'auto',
+        scrollV: 'auto',
+        stretchH: 'hybrid'
+      });
+      wt.draw();
+
+      expect(wt.wtTable.isLastColumnFullyVisible()).toEqual(false); //few pixels are obstacled by scrollbar
+    });
+
+    it('should be true because it is fully visible', function () {
+      createDataArray(18, 4);
+
+      var wt = new Walkontable({
+        table: $table[0],
+        data: getData,
+        totalRows: getTotalRows,
+        totalColumns: getTotalColumns,
+        width: 205,
+        height: 185,
+        scrollH: 'auto',
+        scrollV: 'auto',
+        stretchH: 'hybrid'
+      });
+      wt.draw();
+      wt.scrollHorizontal(1);
+      wt.draw();
+
+      expect(wt.wtTable.isLastColumnFullyVisible()).toEqual(true);
+    });
+  });
 });