resolves #2998 - implement scrollZoom:false for gl3d subplots

Author: etpinard

src/plots/gl3d/camera.js

@@ -48,6 +48,7 @@ function createCamera(element, options) {
 
     var camera = {
         keyBindingMode: 'rotate',
+        enableWheel: true,
         view: view,
         element: element,
         delay: options.delay || 16,
@@ -257,7 +258,9 @@ function createCamera(element, options) {
     }
 
     camera.wheelListener = mouseWheel(element, function(dx, dy) {
+        // TODO remove now that we can disable scroll via scrollZoom?
         if(camera.keyBindingMode === false) return;
+        if(!camera.enableWheel) return;
 
         var flipX = camera.flipX ? 1 : -1;
         var flipY = camera.flipY ? 1 : -1;

src/plots/gl3d/scene.js

@@ -227,8 +227,15 @@ function initializeGLPlot(scene, canvas, gl) {
         scene.graphDiv.emit('plotly_relayout', update);
     };
 
-    scene.glplot.canvas.addEventListener('mouseup', relayoutCallback.bind(null, scene));
-    scene.glplot.canvas.addEventListener('wheel', relayoutCallback.bind(null, scene), passiveSupported ? {passive: false} : false);
+    scene.glplot.canvas.addEventListener('mouseup', function() {
+        relayoutCallback(scene);
+    });
+
+    scene.glplot.canvas.addEventListener('wheel', function() {
+        if(gd._context._scrollZoom.gl3d) {
+            relayoutCallback(scene);
+        }
+    }, passiveSupported ? {passive: false} : false);
 
     if(!scene.staticMode) {
         scene.glplot.canvas.addEventListener('webglcontextlost', function(event) {
@@ -385,7 +392,6 @@ function computeTraceBounds(scene, trace, bounds) {
 }
 
 proto.plot = function(sceneData, fullLayout, layout) {
-
     // Save parameters
     this.plotArgs = [sceneData, fullLayout, layout];
 
@@ -412,6 +418,7 @@ proto.plot = function(sceneData, fullLayout, layout) {
     // Update camera and camera mode
     this.setCamera(fullSceneLayout.camera);
     this.updateFx(fullSceneLayout.dragmode, fullSceneLayout.hovermode);
+    this.camera.enableWheel = this.graphDiv._context._scrollZoom.gl3d;
 
     // Update scene
     this.glplot.update({});
@@ -776,7 +783,6 @@ proto.updateFx = function(dragmode, hovermode) {
             fullCamera.up = zUp;
             Lib.nestedProperty(layout, attr).set(zUp);
         } else {
-
             // none rotation modes [pan or zoom]
             camera.keyBindingMode = dragmode;
         }

test/jasmine/tests/gl3d_plot_interact_test.js

@@ -1097,6 +1097,11 @@ describe('Test gl3d drag and wheel interactions', function() {
             }
         };
 
+        function _assertAndReset(cnt) {
+            expect(relayoutCallback).toHaveBeenCalledTimes(cnt);
+            relayoutCallback.calls.reset();
+        }
+
         Plotly.plot(gd, mock)
         .then(function() {
             relayoutCallback = jasmine.createSpy('relayoutCallback');
@@ -1115,48 +1120,32 @@ describe('Test gl3d drag and wheel interactions', function() {
             return scroll(sceneTarget);
         })
         .then(function() {
-            expect(relayoutCallback).toHaveBeenCalledTimes(1);
-            relayoutCallback.calls.reset();
-
+            _assertAndReset(1);
             return scroll(sceneTarget2);
         })
         .then(function() {
-            expect(relayoutCallback).toHaveBeenCalledTimes(1);
-            relayoutCallback.calls.reset();
-
+            _assertAndReset(1);
             return drag(sceneTarget2, [0, 0], [100, 100]);
         })
         .then(function() {
-            expect(relayoutCallback).toHaveBeenCalledTimes(1);
-            relayoutCallback.calls.reset();
-
+            _assertAndReset(1);
             return drag(sceneTarget, [0, 0], [100, 100]);
         })
         .then(function() {
-            expect(relayoutCallback).toHaveBeenCalledTimes(1);
-            relayoutCallback.calls.reset();
-
-            return Plotly.relayout(gd, {
-                'scene.dragmode': false,
-                'scene2.dragmode': false
-            });
+            _assertAndReset(1);
+            return Plotly.relayout(gd, {'scene.dragmode': false, 'scene2.dragmode': false});
         })
         .then(function() {
-            expect(relayoutCallback).toHaveBeenCalledTimes(1);
-            relayoutCallback.calls.reset();
-
+            _assertAndReset(1);
             return drag(sceneTarget, [0, 0], [100, 100]);
         })
         .then(function() {
             return drag(sceneTarget2, [0, 0], [100, 100]);
         })
         .then(function() {
-            expect(relayoutCallback).toHaveBeenCalledTimes(0);
+            _assertAndReset(0);
 
-            return Plotly.relayout(gd, {
-                'scene.dragmode': 'orbit',
-                'scene2.dragmode': 'turntable'
-            });
+            return Plotly.relayout(gd, {'scene.dragmode': 'orbit', 'scene2.dragmode': 'turntable'});
         })
         .then(function() {
             expect(relayoutCallback).toHaveBeenCalledTimes(1);
@@ -1168,7 +1157,27 @@ describe('Test gl3d drag and wheel interactions', function() {
             return drag(sceneTarget2, [0, 0], [100, 100]);
         })
         .then(function() {
-            expect(relayoutCallback).toHaveBeenCalledTimes(2);
+            _assertAndReset(2);
+            return Plotly.plot(gd, [], {}, {scrollZoom: false});
+        })
+        .then(function() {
+            return scroll(sceneTarget);
+        })
+        .then(function() {
+            return scroll(sceneTarget2);
+        })
+        .then(function() {
+            _assertAndReset(0);
+            return Plotly.plot(gd, [], {}, {scrollZoom: 'gl3d'});
+        })
+        .then(function() {
+            return scroll(sceneTarget);
+        })
+        .then(function() {
+            return scroll(sceneTarget2);
+        })
+        .then(function() {
+            _assertAndReset(2);
         })
         .catch(failTest)
         .then(done);