Adding series and scrolling to quickSwitch

Packages/ohif-lesiontracker/client/components/timepointBrowser/item.html

@@ -1,5 +1,5 @@
 <template name="timepointBrowserItem">
-    <div class="timepoint-browser-item">
+    <div class="timepoint-browser-item" data-id="{{this.timepoint.timepointId}}">
         <div class="timepoint-item p-y-2">
             <div class="timepoint-details clearfix">
                 <div class="timepoint-title pull-left">

Packages/ohif-lesiontracker/client/components/timepointBrowser/item.js

@@ -5,6 +5,8 @@ import { $ } from 'meteor/jquery';
 import { _ } from 'meteor/underscore';
 import { OHIF } from 'meteor/ohif:core';
 
+const studySearchPromises = new Map();
+
 Template.timepointBrowserItem.onCreated(() => {
     const instance = Template.instance();
     const { timepoint, timepointApi } = instance.data;
@@ -28,10 +30,22 @@ Template.timepointBrowserItem.onCreated(() => {
     };
 
     const filter = { studyInstanceUid: timepoint.studyInstanceUids };
-    instance.loadStudies = () => OHIF.studies.searchStudies(filter).then(studiesData => {
+    instance.loadStudies = () => {
+        const promiseKey = JSON.stringify(filter);
+        if (studySearchPromises.has(promiseKey)) {
+            return studySearchPromises.get(promiseKey);
+        } else {
+            const promise = instance.performLoad();
+            studySearchPromises.set(promiseKey, promise);
+            return promise;
+        }
+    };
+
+    instance.performLoad = () => OHIF.studies.searchStudies(filter).then(studiesData => {
         timepoint.studiesData = studiesData;
         timepointApi.timepoints.update(timepoint._id, { $set: { studiesData } });
         instance.loaded = true;
+        instance.setModalitiesSummary();
         instance.loading.set(false);
     }).catch(error => {
         const text = 'An error has occurred while retrieving studies information';
@@ -45,6 +59,10 @@ Template.timepointBrowserItem.onCreated(() => {
 });
 
 Template.timepointBrowserItem.events({
+    'ohif.lesiontracker.timepoint.load .timepoint-item'(event, instance) {
+        instance.loadStudies();
+    },
+
     'click .timepoint-item'(event, instance) {
         const element = event.currentTarget.parentElement;
         const $element = $(element);
@@ -55,10 +73,7 @@ Template.timepointBrowserItem.events({
 
         if (!instance.loaded) {
             instance.summary.set('Loading...');
-            instance.loadStudies().then(() => {
-                Tracker.afterFlush(triggerClick);
-                instance.setModalitiesSummary();
-            });
+            instance.loadStudies().then(() => Tracker.afterFlush(triggerClick));
         } else {
             triggerClick();
         }

Packages/ohif-lesiontracker/client/components/timepointBrowser/sidebar.html

@@ -5,7 +5,7 @@
                 {{>roundedButtonGroup viewTypeButtonGroupData}}
             </div>
         </div>
-        {{#scrollArea class='flex-grow' scrollableClass='p-a-1'}}
+        {{#scrollArea class='flex-grow' class='fit' scrollableClass='p-a-1' scrollStep=191}}
             {{>timepointBrowserList (extend timepointBrowserData)}}
         {{/scrollArea}}
     </div>

Packages/ohif-lesiontracker/client/components/timepointBrowser/sidebar.js

@@ -11,18 +11,19 @@ Template.timepointBrowserSidebar.onCreated(() => {
 
 Template.timepointBrowserSidebar.onRendered(() => {
     const instance = Template.instance();
+    instance.lastType = '';
 
     // Collapse all timepoints but first when timepoint view type changes
+    instance.$browserList = instance.$('.timepoint-browser-list').first();
     instance.autorun(() => {
         // Runs this computation every time the timepointViewType is changed
         const type = instance.timepointViewType.get();
-
-        // Removes all active classes to collapse the timepoints and studies
-        instance.$('.timepoint-browser-item, .study-browser-item').removeClass('active');
-        if (type === 'key') {
-            // Show only first timepoint expanded for key timepoints
-            instance.$('.timepoint-browser-item:first .timepoint-item').trigger('click');
+        if (type !== instance.lastType) {
+            const eventKey = 'ohif.lesiontracker.timepoint.changeViewType';
+            instance.$browserList.trigger(eventKey, type);
         }
+
+        instance.lastType = type;
     });
 });