PWV-73 Determine missing timepoint studies

- Display timepoint availability based on its studies' availability
- Display study availability in study level when timepoint is loaded

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

@@ -2,6 +2,9 @@
     <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-study-availability pull-left m-r-1" >
+                    <i class="fa fa-circle {{studyAvailability}}"></i>
+                </div>
                 <div class="timepoint-title pull-left">
                     {{this.timepointApi.title timepoint}}
                 </div>

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

@@ -13,6 +13,7 @@ Template.timepointBrowserItem.onCreated(() => {
     const hasStudiesData = !!(timepoint.studiesData && timepoint.studiesData.length);
     instance.summary = new ReactiveVar('');
     instance.studiesData = new ReactiveVar(hasStudiesData ? timepoint.studiesData : null);
+    instance.missingStudyUids = new ReactiveVar(null);
 
     const updateStudiesData = newDocument => {
         const newTimepoint = newDocument || timepointApi.timepoints.findOne({ timepointId });
@@ -57,10 +58,45 @@ Template.timepointBrowserItem.onCreated(() => {
         const studiesData = instance.studiesData.get();
         if (studiesData) {
             instance.setModalitiesSummary();
+
+            //  Determine missing timepoint studies
+            const missingStudyUids = [];
+            timepoint.studyInstanceUids.forEach((timepointStudyUid) => {
+                if (!studiesData.find(studyData => studyData.available && studyData.studyInstanceUid === timepointStudyUid)) {
+                    missingStudyUids.push(timepointStudyUid);
+                }
+            });
+            instance.missingStudyUids.set(missingStudyUids);
         }
     });
 });
 
+Template.timepointBrowserItem.helpers({
+    studyAvailability: () => {
+        const instance = Template.instance();
+        const { timepoint } = instance.data;
+        const missingStudyUids = instance.missingStudyUids && instance.missingStudyUids.get();
+
+        if (!missingStudyUids || !timepoint) {
+            //  Timepoint studies are not loaded/checked yet (may be indicated as disabled circle)
+            return "studies-not-ready";
+        }
+
+        if (missingStudyUids.length >= timepoint.studyInstanceUids.length) {
+            //  All timepoint studies are not available (may be indicated as empty circle)
+            return "studies-not-available";
+        }
+
+        if (missingStudyUids.length > 0) {
+            //  Timepoint studies are partially available (may be indicated as half-filled circle)
+            return "studies-partially-available";
+        }
+
+        //  All timepoint studies are available (may be indicated as filled circle)
+        return "studies-fully-available";
+    }
+});
+
 Template.timepointBrowserItem.events({
     'ohif.lesiontracker.timepoint.load .timepoint-item'(event, instance) {
         instance.loadStudies();

Packages/ohif-lesiontracker/client/components/timepointBrowser/list.styl

@@ -78,6 +78,16 @@
     theme('color', '$textPrimaryColor')
     padding-top: 2px
 
+  .timepoint-study-availability
+    .studies-not-ready
+      color: gray
+    .studies-not-available
+      color: red
+    .studies-partially-available
+      color: yellow
+    .studies-fully-available
+      color: green
+
 .series-quick-switch .timepoint-browser-list
   padding: 0 10px