Merge pull request #502 from agirault/pinch-manipulator

feat(cameraManipulator): expose pinch/scroll event to manipulators

Author: jourdain

Sources/Interaction/Manipulators/CameraManipulator/example/controller.html

@@ -116,5 +116,18 @@
         </select>
       </td>
     </tr>
+    <tr>
+      <td>Scroll</td>
+      <td>
+      </td>
+      <td>
+        <select class='scrollMiddleButton' style="width: 100%">
+          <option value='None'>None</option>
+          <option value='Zoom'>Zoom</option>
+        </select>
+      </td>
+      <td>
+      </td>
+    </tr>
   </tbody>
 </table>

Sources/Interaction/Manipulators/CameraManipulator/example/index.js

@@ -67,6 +67,7 @@ const selectMap = {
   controlLeftButton: { button: 1, shift: false, control: true },
   controlMiddleButton: { button: 2, shift: false, control: true },
   controlRightButton: { button: 3, shift: false, control: true },
+  scrollMiddleButton: { pinch: true },
 };
 
 const manipulatorFactory = {
@@ -88,6 +89,7 @@ function reassignManipulators() {
     manipulator.setButton(selectMap[keyName].button);
     manipulator.setShift(selectMap[keyName].shift);
     manipulator.setControl(selectMap[keyName].control);
+    manipulator.setPinch(selectMap[keyName].pinch);
     interactorStyle.addManipulator(manipulator);
   });
 }

Sources/Interaction/Manipulators/CameraManipulator/index.js

@@ -43,6 +43,8 @@ const DEFAULT_VALUES = {
   center: [0, 0, 0],
   rotationFactor: 1,
   displayCenter: [0, 0],
+
+  pinch: false,
 };
 
 // ----------------------------------------------------------------------------
@@ -61,6 +63,7 @@ export function extend(publicAPI, model, initialValues = {}) {
     'control',
     'alt',
     'rotationFactor',
+    'pinch',
   ]);
 
   macro.setGetArray(publicAPI, model, ['displayCenter'], 2);

Sources/Interaction/Manipulators/TrackballZoom/index.js

@@ -76,6 +76,31 @@ function vtkTrackballZoom(publicAPI, model) {
       renderer.resetCameraClippingRange();
     }
   };
+
+  publicAPI.onPinch = (interactor) => {
+    const { x, y } =
+      interactor.getAnimationEventPosition(interactor.getPointerIndex()) ||
+      DEFAULT_POSITION;
+    const interactorStyle = interactor.getInteractorStyle();
+    const renderer =
+      interactorStyle.getCurrentRenderer() ||
+      interactor.findPokedRenderer(x, y);
+
+    const camera = renderer.getActiveCamera();
+
+    const dyf = interactor.getScale() / interactor.getLastScale();
+
+    if (camera.getParallelProjection()) {
+      camera.setParallelScale(camera.getParallelScale() / dyf);
+    } else {
+      camera.dolly(dyf);
+      renderer.resetCameraClippingRange();
+    }
+
+    if (interactor.getLightFollowCamera()) {
+      renderer.updateLightsGeometryToFollowCamera();
+    }
+  };
 }
 
 // ----------------------------------------------------------------------------

Sources/Interaction/Style/InteractorStyleManipulator/index.js

@@ -356,9 +356,12 @@ function vtkInteractorStyleManipulator(publicAPI, model) {
     }
   };
 
+  //-------------------------------------------------------------------------
   publicAPI.handlePinch = () => {
     model.cameraManipulators.filter((m) => m.onPinch).forEach((manipulator) => {
-      manipulator.onPinch(model.interactor);
+      if (manipulator && manipulator.getPinch()) {
+        manipulator.onPinch(model.interactor);
+      }
     });
     publicAPI.invokeInteractionEvent({ type: 'InteractionEvent' });
   };