feat(commandsModule): Add previousImage and nextImage actions and commands (#710)

* feat(commandsModule): Add `previousImage` and `nextImage` actions and commands

This change adds the keybindings for previousImage (down) and nextImage (up) to the default
configuration and adds the command and action necessary to support it. This pull request is
dependent upon https://github.com/cornerstonejs/cornerstoneTools/pull/1025 which exports the scroll
utility it uses.

* style(default.js): Switch tabs to spaces

* fix(commandsModule): import `scroll` through cornerstoneTools.import

extensions/ohif-cornerstone-extension/src/commandsModule.js

@@ -1,6 +1,7 @@
 import cornerstone from 'cornerstone-core';
 import cornerstoneTools from 'cornerstone-tools';
 import OHIF from 'ohif-core';
+const scroll = cornerstoneTools.import('util/scroll');
 
 const actions = {
   rotateViewport: ({ viewports, rotation }) => {
@@ -145,6 +146,22 @@ const actions = {
       });
     });
   },
+  nextImage: ({ viewports }) => {
+    const enabledElement = _getActiveViewportEnabledElement(
+      viewports.viewportSpecificData,
+      viewports.activeViewportIndex
+    );
+
+    scroll(enabledElement, 1);
+  },
+  previousImage: ({ viewports }) => {
+    const enabledElement = _getActiveViewportEnabledElement(
+      viewports.viewportSpecificData,
+      viewports.activeViewportIndex
+    );
+
+    scroll(enabledElement, -1);
+  }
 };
 
 const definitions = {
@@ -198,7 +215,16 @@ const definitions = {
     storeContexts: ['viewports'],
     options: {},
   },
-  // TODO: Next/Previous image
+  nextImage: {
+    commandFn: actions.nextImage,
+    storeContexts: ['viewports'],
+    options: {},
+  },
+  previousImage: {
+    commandFn: actions.previousImage,
+    storeContexts: ['viewports'],
+    options: {},
+  },
   // TODO: First/Last image
   // Next/Previous series/DisplaySet
   nextViewportDisplaySet: {

public/config/default.js

@@ -54,8 +54,8 @@ window.config = {
     { commandName: 'fitViewportToWindow', label: 'Zoom to Fit', keys: ['='] },
     { commandName: 'resetViewport', label: 'Reset', keys: ['space'] },
     // clearAnnotations
-    // nextImage
-    // previousImage
+    { commandName: 'nextImage', label: 'Next Image', keys: ['up'] },
+    { commandName: 'previousImage', label: 'Previous Image', keys: ['down'] },
     // firstImage
     // lastImage
     {