chore(release): publish [skip ci]

- @ohif/viewer@2.1.3

platform/viewer/.webpack/webpack.commonjs.js

@@ -4,6 +4,7 @@ const path = require('path');
 const merge = require('webpack-merge');
 const webpackCommon = require('./../../../.webpack/webpack.commonjs.js');
 // ~~ Plugins
+const CopyWebpackPlugin = require('copy-webpack-plugin');
 const { CleanWebpackPlugin } = require('clean-webpack-plugin');
 const fontsToJavaScriptRule = require('./rules/fontsToJavaScript.js');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
@@ -12,7 +13,9 @@ const SRC_DIR = path.join(__dirname, '../src');
 const DIST_DIR = path.join(__dirname, '../dist');
 const PUBLIC_DIR = path.join(__dirname, '../public');
 // ~~ Env Vars
+const APP_CONFIG = process.env.APP_CONFIG || 'config/default.js';
 const HTML_TEMPLATE = process.env.HTML_TEMPLATE || 'script-tag.html';
+const PUBLIC_URL = process.env.PUBLIC_URL || '/';
 
 module.exports = (env, argv) => {
   const commonConfig = webpackCommon(env, argv, { SRC_DIR, DIST_DIR });
@@ -33,12 +36,22 @@ module.exports = (env, argv) => {
     plugins: [
       // Clean output.path
       new CleanWebpackPlugin(),
+      new CopyWebpackPlugin([
+        // Copy over and rename our target app config file
+        {
+          from: `${PUBLIC_DIR}/${APP_CONFIG}`,
+          to: `${DIST_DIR}/app-config.js`,
+        },
+      ]),
       // Generate "index.html" w/ correct includes/imports
       // NOTE: We use this for E2E Tests
       new HtmlWebpackPlugin({
         inject: false,
         template: `${PUBLIC_DIR}/html-templates/${HTML_TEMPLATE}`,
         filename: 'index.html',
+        templateParameters: {
+          PUBLIC_URL: PUBLIC_URL,
+        },
       }),
       new webpack.optimize.LimitChunkCountPlugin({
         maxChunks: 1,

platform/viewer/CHANGELOG.md

@@ -3,6 +3,36 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [2.1.3](https://github.com/OHIF/Viewers/compare/@ohif/viewer@2.1.2...@ohif/viewer@2.1.3) (2019-10-26)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [2.1.2](https://github.com/OHIF/Viewers/compare/@ohif/viewer@2.1.1...@ohif/viewer@2.1.2) (2019-10-26)
+
+
+### Bug Fixes
+
+* update script-tag output to include config from default.js ([c522ff3](https://github.com/OHIF/Viewers/commit/c522ff3ddab7ed8e3a128dd6edd2cd6902226e99))
+
+
+
+
+
+## [2.1.1](https://github.com/OHIF/Viewers/compare/@ohif/viewer@2.1.0...@ohif/viewer@2.1.1) (2019-10-26)
+
+
+### Bug Fixes
+
+* 🐛 JSON launch not working properly ([#1089](https://github.com/OHIF/Viewers/issues/1089)) ([#1093](https://github.com/OHIF/Viewers/issues/1093)) ([2677170](https://github.com/OHIF/Viewers/commit/2677170d67659ee178cf77307414d54cfe9cb563))
+
+
+
+
+
 # [2.1.0](https://github.com/OHIF/Viewers/compare/@ohif/viewer@2.0.0...@ohif/viewer@2.1.0) (2019-10-26)
 
 

platform/viewer/cypress/integration/common/OHIFCornerstoneHotkeys.spec.js

@@ -0,0 +1,153 @@
+describe('OHIF Cornerstone Hotkeys', () => {
+  before(() => {
+    cy.openStudy('MISTER^MR');
+    cy.waitDicomImage();
+    cy.expectMinimumThumbnails(3);
+  });
+
+  beforeEach(() => {
+    cy.initCornerstoneToolsAliases();
+    cy.initCommonElementsAliases();
+    cy.resetViewport();
+  });
+
+  it('checks if hotkeys "R" and "L" can rotate the image', () => {
+    // Hotkey R
+    cy.get('body').type('R');
+    cy.get('@viewportInfoMidLeft').should('contains.text', 'P');
+    cy.get('@viewportInfoMidTop').should('contains.text', 'R');
+    // Hotkey L
+    cy.get('body').type('L');
+    cy.get('@viewportInfoMidLeft').should('contains.text', 'R');
+    cy.get('@viewportInfoMidTop').should('contains.text', 'A');
+  });
+
+  it('checks if hotkeys "ArrowUp" and "ArrowDown" can navigate in the stack', () => {
+    // Hotkey ArrowDown
+    cy.get('body').type('{downarrow}');
+    cy.get('@viewportInfoBottomLeft').should('contains.text', 'Img: 2 2/26');
+    // Hotkey ArrowUp
+    cy.get('body').type('{uparrow}');
+    cy.get('@viewportInfoBottomLeft').should('contains.text', 'Img: 1 1/26');
+  });
+
+  it('checks if hotkeys "V" and "H" can flip the image', () => {
+    // Hotkey V
+    cy.get('body').type('V');
+    cy.get('@viewportInfoMidLeft').should('contains.text', 'L');
+    cy.get('@viewportInfoMidTop').should('contains.text', 'A');
+    // Hotkey H
+    cy.get('body').type('H');
+    cy.get('@viewportInfoMidLeft').should('contains.text', 'L');
+    cy.get('@viewportInfoMidTop').should('contains.text', 'P');
+  });
+
+  it('checks if hotkey "I" can invert the image', () => {
+    // Hotkey I
+    cy.get('body').type('I');
+    // Visual comparison
+    cy.screenshot();
+    cy.percyCanvasSnapshot('Hotkey I - invert image');
+  });
+
+  it('checks if hotkeys "+", "-" and "=" can zoom in, out and fit to viewport', () => {
+    // Hotkey +
+    cy.get('body').type('+++'); // Press hotkey 3 times
+    cy.get('@viewportInfoBottomRight').should('contains.text', 'Zoom: 256%');
+    // Hotkey -
+    cy.get('body').type('-');
+    cy.get('@viewportInfoBottomRight').should('contains.text', 'Zoom: 241%');
+    // Hotkey =
+    cy.get('body').type('=');
+    cy.get('@viewportInfoBottomRight').should('contains.text', 'Zoom: 211%');
+  });
+
+  it('checks if hotkey "SPACEBAR" can reset the image', () => {
+    // Press multiples hotkeys
+    cy.get('body').type('V+++I');
+    cy.get('@viewportInfoMidLeft').should('contains.text', 'L');
+    cy.get('@viewportInfoMidTop').should('contains.text', 'A');
+    cy.get('@viewportInfoBottomRight').should('contains.text', 'Zoom: 256%');
+
+    // Hotkey SPACEBAR
+    cy.get('body').type(' ');
+    cy.get('@viewportInfoMidLeft').should('contains.text', 'R');
+    cy.get('@viewportInfoMidTop').should('contains.text', 'A');
+    cy.get('@viewportInfoBottomRight').should('contains.text', 'Zoom: 211%');
+
+    // Visual comparison to make sure the 'inverted' image was reset
+    cy.screenshot();
+    cy.percyCanvasSnapshot('Hotkey SPACEBAR - Reset Image');
+  });
+
+  it('uses hotkeys "RightArrow" and "LeftArrow" to navigate between multiple viewports', () => {
+    //Click on Layout button
+    cy.get('@layoutBtn').click();
+    //Select 3 viewports
+    cy.get('tbody > :nth-child(1) > :nth-child(3)').click();
+
+    // Press multiples hotkeys on viewport #1
+    cy.get('body').type('VL+++I');
+    cy.get('@viewportInfoMidLeft').should('contains.text', 'A');
+    cy.get('@viewportInfoMidTop').should('contains.text', 'R');
+    cy.get('@viewportInfoBottomRight').should('contains.text', 'Zoom: 134%');
+
+    // Hotkey RightArrow: Move to next viewport
+    cy.get('body').type('{rightarrow}');
+
+    // Get overlay information from viewport #2
+    cy.get(
+      ':nth-child(2) > .viewport-wrapper > .viewport-element > .ViewportOrientationMarkers.noselect > .top-mid.orientation-marker'
+    ).as('viewport2InfoMidTop');
+    cy.get(
+      ':nth-child(2) > .viewport-wrapper > .viewport-element > .ViewportOrientationMarkers.noselect > .left-mid.orientation-marker'
+    ).as('viewport2InfoMidLeft');
+    cy.get(
+      ':nth-child(2) > .viewport-wrapper > .viewport-element > .ViewportOverlay > div.bottom-right.overlay-element > div'
+    ).as('viewport2InfoBottomRight');
+
+    // Press multiples hotkeys on viewport #2
+    cy.get('body').type('RR++H+++I');
+    cy.get('@viewport2InfoMidLeft').should('contains.text', 'P');
+    cy.get('@viewport2InfoMidTop').should('contains.text', 'H');
+    cy.get('@viewport2InfoBottomRight').should('contains.text', 'Zoom: 120%');
+
+    // Hotkey LeftArrow: Move to previous viewport
+    cy.get('body').type('{leftarrow}');
+
+    // Hotkey SPACEBAR: Reset viewport #1
+    cy.get('body').type(' ');
+    cy.get('@viewportInfoMidLeft').should('contains.text', 'R');
+    cy.get('@viewportInfoMidTop').should('contains.text', 'A');
+    cy.get('@viewportInfoBottomRight').should('contains.text', 'Zoom: 89%');
+
+    // Hotkey RightArrow: Move to next viewport
+    cy.get('body').type('{rightarrow}');
+
+    // Hotkey SPACEBAR: Reset viewport #2
+    cy.get('body').type(' ');
+    cy.get('@viewport2InfoMidLeft').should('contains.text', 'A');
+    cy.get('@viewport2InfoMidTop').should('contains.text', 'H');
+    cy.get('@viewport2InfoBottomRight').should('contains.text', 'Zoom: 45%');
+  });
+
+  //TO-DO: This test is blocked by issue #1095 (https://github.com/OHIF/Viewers/issues/1095)
+  //Once issue is fixed, this test can be uncommented
+  // it('checks if hotkey "Z" activates zoom tool', () => {
+  //   // Hotkey Z
+  //   cy.get('body').type('Z');
+  //   // Verify if icon is active on toolbar
+  //   cy.get('@zoomBtn').should('have.class', 'active');
+  // });
+
+  //TO-DO: This test is blocked by issue #1095 (https://github.com/OHIF/Viewers/issues/1095)
+  //Once issue is fixed, this test can be uncommented
+  // it('checks if hotkeys "PageDown" and "PageUp" can navigate in the series thumbnails', () => {
+  //   // Hotkey PageDown
+  //   cy.get('body').type('{pagedown}{pagedown}'); // press hotkey twice
+  //   cy.get('@viewportInfoBottomLeft').should('contains.text', 'Ser: 3');
+  //   // Hotkey PageUp
+  //   cy.get('body').type('{pageup}');
+  //   cy.get('@viewportInfoBottomLeft').should('contains.text', 'Ser: 2');
+  // });
+});

platform/viewer/cypress/integration/common/OHIFCornerstoneToolbar.spec.js

@@ -66,7 +66,7 @@ describe('OHIF Cornerstone Toolbar', () => {
   });
 
   it('checks if Zoom tool will zoom in/out an image in the viewport', () => {
-    //Click on button and vefiry if icon is active on toolbar
+    //Click on button and verify if icon is active on toolbar
     cy.get('@zoomBtn')
       .click()
       .then($zoomBtn => {

platform/viewer/cypress/support/aliases.js

@@ -30,6 +30,8 @@ export function initCommonElementsAliases() {
   cy.get('div.ViewportOverlay > div.bottom-right.overlay-element > div').as(
     'viewportInfoBottomRight'
   );
+  cy.get('.left-mid.orientation-marker').as('viewportInfoMidLeft');
+  cy.get('.top-mid.orientation-marker').as('viewportInfoMidTop');
 }
 
 //Creating aliases for Routes

platform/viewer/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/viewer",
-  "version": "2.1.0",
+  "version": "2.1.3",
   "description": "OHIF Viewer",
   "author": "OHIF Contributors",
   "license": "MIT",

platform/viewer/public/html-templates/script-tag.html

@@ -24,6 +24,7 @@
 
   <div id="root"></div>
 
+  <script type="text/javascript" src="<%= PUBLIC_URL %>app-config.js"></script>
   <script src="/index.umd.js" crossorigin></script>
   <script>
     var containerId = 'root';
@@ -31,25 +32,7 @@
       console.log('OHIF Viewer rendered/updated');
     };
     window.OHIFViewer.installViewer(
-      {
-        // routerBasename: '/',
-        servers: {
-          dicomWeb: [
-            {
-              name: 'DCM4CHEE',
-              wadoUriRoot:
-                'https://server.dcmjs.org/dcm4chee-arc/aets/DCM4CHEE/wado',
-              qidoRoot:
-                'https://server.dcmjs.org/dcm4chee-arc/aets/DCM4CHEE/rs',
-              wadoRoot:
-                'https://server.dcmjs.org/dcm4chee-arc/aets/DCM4CHEE/rs',
-              qidoSupportsIncludeField: true,
-              imageRendering: 'wadors',
-              thumbnailRendering: 'wadors',
-            },
-          ],
-        },
-      },
+      window.config, // See `/config/default.js`
       containerId,
       componentRenderedOrUpdatedCallback
     );

platform/viewer/src/connectedComponents/ViewerMain.js

@@ -59,12 +59,7 @@ class ViewerMain extends Component {
     // Get all the display sets for the viewer studies
     if (this.props.studies) {
       const displaySets = this.getDisplaySets(this.props.studies);
-
-      this.setState({
-        displaySets,
-      });
-
-      this.fillEmptyViewportPanes();
+      this.setState({ displaySets }, this.fillEmptyViewportPanes);
     }
   }
 
@@ -78,12 +73,7 @@ class ViewerMain extends Component {
       (viewportAmount !== prevViewportAmount && !isVtk)
     ) {
       const displaySets = this.getDisplaySets(this.props.studies);
-
-      this.setState({
-        displaySets,
-      });
-
-      this.fillEmptyViewportPanes();
+      this.setState({ displaySets }, this.fillEmptyViewportPanes);
     }
   }
 

platform/viewer/src/routes/StandaloneRouting.js

@@ -1,10 +1,10 @@
-import React, { Component } from "react";
-import { log, metadata, studies, utils } from "@ohif/core";
+import React, { Component } from 'react';
+import { log, metadata, studies, utils } from '@ohif/core';
 
-import PropTypes from "prop-types";
-import Viewer from "../connectedComponents/Viewer";
-import { extensionManager } from "./../App.js";
-import qs from "querystring";
+import PropTypes from 'prop-types';
+import ConnectedViewer from '../connectedComponents/ConnectedViewer';
+import { extensionManager } from './../App.js';
+import qs from 'querystring';
 
 const { OHIFStudyMetadata } = metadata;
 const { retrieveStudiesMetadata } = studies;
@@ -13,12 +13,14 @@ const { studyMetadataManager, updateMetaDataManager } = utils;
 class StandaloneRouting extends Component {
   state = {
     studies: null,
-    error: null
+    error: null,
   };
 
+  studyInstanceUids = [];
+
   static propTypes = {
     location: PropTypes.object,
-    store: PropTypes.object
+    store: PropTypes.object,
   };
 
   static parseQueryAndFetchStudies(query) {
@@ -26,7 +28,7 @@ class StandaloneRouting extends Component {
       const url = query.url;
 
       if (!url) {
-        return reject(new Error("No URL was specified. Use ?url=$yourURL"));
+        return reject(new Error('No URL was specified. Use ?url=$yourURL'));
       }
 
       // Define a request to the server to retrieve the study data
@@ -34,19 +36,19 @@ class StandaloneRouting extends Component {
       const oReq = new XMLHttpRequest();
 
       // Add event listeners for request failure
-      oReq.addEventListener("error", error => {
-        log.warn("An error occurred while retrieving the JSON data");
+      oReq.addEventListener('error', error => {
+        log.warn('An error occurred while retrieving the JSON data');
         reject(error);
       });
 
       // When the JSON has been returned, parse it into a JavaScript Object
       // and render the OHIF Viewer with this data
-      oReq.addEventListener("load", () => {
+      oReq.addEventListener('load', () => {
         // Parse the response content
         // https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/responseText
         if (!oReq.responseText) {
-          log.warn("Response was undefined");
-          reject(new Error("Response was undefined"));
+          log.warn('Response was undefined');
+          reject(new Error('Response was undefined'));
         }
 
         log.info(JSON.stringify(oReq.responseText, null, 2));
@@ -54,9 +56,9 @@ class StandaloneRouting extends Component {
         const data = JSON.parse(oReq.responseText);
         if (data.servers && query.studyInstanceUids) {
           const server = data.servers.dicomWeb[0];
-          server.type = "dicomWeb";
+          server.type = 'dicomWeb';
 
-          const studyInstanceUids = query.studyInstanceUids.split(";");
+          const studyInstanceUids = query.studyInstanceUids.split(';');
           const seriesInstanceUids = [];
 
           retrieveStudiesMetadata(
@@ -80,8 +82,8 @@ class StandaloneRouting extends Component {
       // In this case we have a server-side route called /api/
       // which responds to GET requests with the study data
       log.info(`Sending Request to: ${url}`);
-      oReq.open("GET", url);
-      oReq.setRequestHeader("Accept", "application/json");
+      oReq.open('GET', url);
+      oReq.setRequestHeader('Accept', 'application/json');
 
       // Fire the request to the server
       oReq.send();
@@ -101,13 +103,14 @@ class StandaloneRouting extends Component {
       studyMetadataManager.purge();
 
       // Map studies to new format, update metadata manager?
+      const uniqueStudyUids = new Set();
       const updatedStudies = studies.map(study => {
         const studyMetadata = new OHIFStudyMetadata(
           study,
           study.studyInstanceUid
         );
         const sopClassHandlerModules =
-          extensionManager.modules["sopClassHandlerModule"];
+          extensionManager.modules['sopClassHandlerModule'];
 
         study.displaySets =
           study.displaySets ||
@@ -118,10 +121,12 @@ class StandaloneRouting extends Component {
         updateMetaDataManager(study);
 
         studyMetadataManager.add(studyMetadata);
+        uniqueStudyUids.add(study.studyInstanceUid);
 
         return study;
       });
 
+      this.studyInstanceUids = Array.from(uniqueStudyUids);
       this.setState({ studies: updatedStudies });
     } catch (error) {
       this.setState({ error });
@@ -134,8 +139,12 @@ class StandaloneRouting extends Component {
     } else if (!this.state.studies) {
       return <div>Loading...</div>;
     }
-
-    return <Viewer studies={this.state.studies} />;
+    return (
+      <ConnectedViewer
+        studies={this.state.studies}
+        studyInstanceUids={this.studyInstanceUids}
+      />
+    );
   }
 }