From 0ec797a79c5f9522e904aa5ebb77ef8174e40322 Mon Sep 17 00:00:00 2001 From: Bruno Alves de Faria Date: Tue, 23 Aug 2016 18:00:06 -0300 Subject: [PATCH] AWV-1: Adding navigation of display sets --- .../toolbarSection/toolbarSection.js | 16 +++++++ Packages/ohif-core/client/lib/index.js | 1 + Packages/ohif-core/client/lib/viewer.js | 45 +++++++++++++++++++ .../displaySetNavigation.html | 16 +++++++ .../displaySetNavigation.js | 12 +++++ .../imageViewerViewport.js | 28 ++++++------ .../viewer/playClipButton/playClipButton.html | 24 +++++----- Packages/viewerbase/lib/enableHotkeys.js | 12 ++++- Packages/viewerbase/package.js | 7 ++- 9 files changed, 129 insertions(+), 32 deletions(-) create mode 100644 Packages/ohif-core/client/lib/viewer.js create mode 100644 Packages/viewerbase/client/components/viewer/displaySetNavigation/displaySetNavigation.html create mode 100644 Packages/viewerbase/client/components/viewer/displaySetNavigation/displaySetNavigation.js diff --git a/OHIFViewer/client/components/toolbarSection/toolbarSection.js b/OHIFViewer/client/components/toolbarSection/toolbarSection.js index 8f34ac230..cb4dc3eb8 100644 --- a/OHIFViewer/client/components/toolbarSection/toolbarSection.js +++ b/OHIFViewer/client/components/toolbarSection/toolbarSection.js @@ -92,6 +92,22 @@ Template.toolbarSection.helpers({ iconClasses: 'fa fa-undo' }); + buttonData.push({ + id: 'previousDisplaySet', + title: 'Previous', + classes: 'imageViewerCommand', + buttonTemplateName: 'displaySetNavigation', + isPrevious: true + }); + + buttonData.push({ + id: 'nextDisplaySet', + title: 'Next', + classes: 'imageViewerCommand', + buttonTemplateName: 'displaySetNavigation', + isPrevious: false + }); + buttonData.push({ id: 'toggleCinePlay', title: 'Toggle CINE Play', diff --git a/Packages/ohif-core/client/lib/index.js b/Packages/ohif-core/client/lib/index.js index 56c8d9f11..3f9be996f 100644 --- a/Packages/ohif-core/client/lib/index.js +++ b/Packages/ohif-core/client/lib/index.js @@ -2,3 +2,4 @@ import './blaze.js'; import './string.js'; import './ui.js'; import './user.js'; +import './viewer.js'; diff --git a/Packages/ohif-core/client/lib/viewer.js b/Packages/ohif-core/client/lib/viewer.js new file mode 100644 index 000000000..059d57c1a --- /dev/null +++ b/Packages/ohif-core/client/lib/viewer.js @@ -0,0 +1,45 @@ +import { OHIF } from 'meteor/ohif:core'; + +OHIF.viewer = {}; + +// Move display sets forward or backward in the selected viewport +OHIF.viewer.moveDisplaySet = isNext => { + // Get the selected viewport index + const viewportIndex = Session.get('activeViewport'); + + // Get the selected viewport data + const viewportData = window.layoutManager.viewportData[viewportIndex]; + + // Get the current study + const currentStudy = _.findWhere(window.layoutManager.studies, { + studyInstanceUid: viewportData.studyInstanceUid + }) || window.layoutManager.studies[0]; + + // Get the display sets + const displaySets = currentStudy.displaySets; + + // Get the current display set + const currentDisplaySet = _.findWhere(displaySets, { + displaySetInstanceUid: viewportData.displaySetInstanceUid + }); + + // Get the new index and ensure that it will exists in display sets + let newIndex = _.indexOf(displaySets, currentDisplaySet); + if (isNext) { + newIndex++; + if (newIndex >= displaySets.length) { + newIndex = 0; + } + } else { + newIndex--; + if (newIndex < 0) { + newIndex = displaySets.length - 1; + } + } + + // Get the display set data for the new index + const newDisplaySetData = displaySets[newIndex]; + + // Rerender the viewport using the new display set data + window.layoutManager.rerenderViewportWithNewDisplaySet(viewportIndex, newDisplaySetData); +}; diff --git a/Packages/viewerbase/client/components/viewer/displaySetNavigation/displaySetNavigation.html b/Packages/viewerbase/client/components/viewer/displaySetNavigation/displaySetNavigation.html new file mode 100644 index 000000000..bc6ed243a --- /dev/null +++ b/Packages/viewerbase/client/components/viewer/displaySetNavigation/displaySetNavigation.html @@ -0,0 +1,16 @@ + diff --git a/Packages/viewerbase/client/components/viewer/displaySetNavigation/displaySetNavigation.js b/Packages/viewerbase/client/components/viewer/displaySetNavigation/displaySetNavigation.js new file mode 100644 index 000000000..65ca85618 --- /dev/null +++ b/Packages/viewerbase/client/components/viewer/displaySetNavigation/displaySetNavigation.js @@ -0,0 +1,12 @@ +import { OHIF } from 'meteor/ohif:core'; +import { Template } from 'meteor/templating'; + +Template.displaySetNavigation.events({ + 'click .js-next'(event, instance) { + OHIF.viewer.moveDisplaySet(true); + }, + + 'click .js-prev'(event, instance) { + OHIF.viewer.moveDisplaySet(false); + } +}); diff --git a/Packages/viewerbase/client/components/viewer/imageViewerViewport/imageViewerViewport.js b/Packages/viewerbase/client/components/viewer/imageViewerViewport/imageViewerViewport.js index b91d26651..e312dba69 100644 --- a/Packages/viewerbase/client/components/viewer/imageViewerViewport/imageViewerViewport.js +++ b/Packages/viewerbase/client/components/viewer/imageViewerViewport/imageViewerViewport.js @@ -116,6 +116,20 @@ function loadDisplaySetIntoViewport(data, templateData) { var endLoadingHandler = cornerstoneTools.loadHandlerManager.getEndLoadHandler(); var errorLoadingHandler = cornerstoneTools.loadHandlerManager.getErrorLoadingHandler(); + // Get the current viewport settings + var viewport = cornerstone.getViewport(element); + + // Store the current series data inside the Layout Manager + layoutManager.viewportData[viewportIndex] = { + imageId: imageId, + studyInstanceUid: data.studyInstanceUid, + seriesInstanceUid: data.seriesInstanceUid, + displaySetInstanceUid: data.displaySetInstanceUid, + currentImageIdIndex: data.currentImageIdIndex, + viewport: viewport, + viewportIndex: viewportIndex + }; + // Start loading the image. cornerstone.loadAndCacheImage(imageId).then(function(image) { var enabledElement; @@ -188,9 +202,6 @@ function loadDisplaySetIntoViewport(data, templateData) { // Add stack state managers for the stack tool, CINE tool, and reference lines cornerstoneTools.addStackStateManager(element, ['stack', 'playClip', 'referenceLines']); - // Get the current viewport settings - var viewport = cornerstone.getViewport(element); - // Enable orientation markers, if applicable updateOrientationMarkers(element); @@ -322,17 +333,6 @@ function loadDisplaySetIntoViewport(data, templateData) { $(element).off(allCornerstoneEvents, sendActivationTrigger); $(element).on(allCornerstoneEvents, sendActivationTrigger); - // Store the current series data inside the Layout Manager - layoutManager.viewportData[viewportIndex] = { - imageId: imageId, - studyInstanceUid: data.studyInstanceUid, - seriesInstanceUid: data.seriesInstanceUid, - displaySetInstanceUid: data.displaySetInstanceUid, - currentImageIdIndex: data.currentImageIdIndex, - viewport: viewport, - viewportIndex: viewportIndex - }; - ViewerData[contentId].loadedSeriesData = layoutManager.viewportData; // Check if image plane (orientation / loction) data is present for the current image diff --git a/Packages/viewerbase/client/components/viewer/playClipButton/playClipButton.html b/Packages/viewerbase/client/components/viewer/playClipButton/playClipButton.html index f49b909bf..5ec6b45fb 100644 --- a/Packages/viewerbase/client/components/viewer/playClipButton/playClipButton.html +++ b/Packages/viewerbase/client/components/viewer/playClipButton/playClipButton.html @@ -1,20 +1,16 @@ \ No newline at end of file + diff --git a/Packages/viewerbase/lib/enableHotkeys.js b/Packages/viewerbase/lib/enableHotkeys.js index 00abd4b37..6647194f6 100644 --- a/Packages/viewerbase/lib/enableHotkeys.js +++ b/Packages/viewerbase/lib/enableHotkeys.js @@ -12,8 +12,10 @@ Meteor.startup(function() { stackScroll: 'S', pan: 'P', magnify: 'M', - scrollDown: ['DOWN', 'PAGEDOWN'], - scrollUp: ['UP', 'PAGEUP'], + scrollDown: 'DOWN', + scrollUp: 'UP', + nextDisplaySet: 'PAGEDOWN', + previousDisplaySet: 'PAGEUP', nextPanel: 'RIGHT', previousPanel: 'LEFT', invert: 'I', @@ -142,6 +144,12 @@ Meteor.startup(function() { switchToImageRelative(-1); } }, + previousDisplaySet() { + OHIF.viewer.moveDisplaySet(false); + }, + nextDisplaySet() { + OHIF.viewer.moveDisplaySet(true); + }, nextPanel: function() { nextActivePanel(); }, diff --git a/Packages/viewerbase/package.js b/Packages/viewerbase/package.js index 68f61f9dc..96bdcfa3f 100644 --- a/Packages/viewerbase/package.js +++ b/Packages/viewerbase/package.js @@ -15,7 +15,7 @@ Package.onUse(function(api) { api.use('practicalmeteor:loglevel'); api.use('momentjs:moment'); api.use('validatejs'); - + // Our custom packages api.use('design'); api.use('ohif:core'); @@ -119,6 +119,9 @@ Package.onUse(function(api) { api.addFiles('client/components/viewer/playClipButton/playClipButton.html', 'client'); api.addFiles('client/components/viewer/playClipButton/playClipButton.js', 'client'); + api.addFiles('client/components/viewer/displaySetNavigation/displaySetNavigation.html', 'client'); + api.addFiles('client/components/viewer/displaySetNavigation/displaySetNavigation.js', 'client'); + // Library functions api.addFiles('lib/layoutManager.js', 'client'); api.addFiles('lib/createStacks.js', 'client'); @@ -139,7 +142,7 @@ Package.onUse(function(api) { api.addFiles('lib/resizeViewportElements.js', 'client'); api.addFiles('lib/setFocusToActiveViewport.js', 'client'); api.addFiles('lib/updateAllViewports.js', 'client'); - + api.addFiles('lib/instanceClassSpecificViewport.js', 'client'); api.addFiles('lib/setMammogramViewportAlignment.js', 'client'); api.addFiles('lib/isImage.js', 'client');