LT-251: Disabling drag and drop from series and adding click-to-select behavior for quick switch areas

Packages/lesiontracker/client/components/studySeriesQuickSwitch/studySeriesQuickSwitch.html

@@ -5,7 +5,7 @@
             <div class="studySwitch"></div>
             <div class="switchHover studyHover clearfix">
                 <div class="scrollArea">
-                    {{>studyTimepointBrowser timepointViewType=timepointViewType}}
+                    {{>studyTimepointBrowser timepointViewType=timepointViewType viewportIndex=viewportIndex}}
                 </div>
             </div>
         </div>
@@ -26,7 +26,7 @@
             <div class="switchHover seriesHover clearfix">
                 <div class="scrollArea">
                     {{#each thumbnail in (thumbnails currentStudy)}}
-                        {{>thumbnailEntry thumbnail}}
+                        {{>thumbnailEntry thumbnail=thumbnail viewportIndex=viewportIndex}}
                     {{/each}}
                 </div>
             </div>

Packages/lesiontracker/client/components/studySeriesQuickSwitch/studySeriesQuickSwitch.js

@@ -13,7 +13,6 @@ Template.studySeriesQuickSwitch.helpers({
     },
 
     currentStudy() {
-        console.log('currentStudy');
         var viewportIndex = Template.instance().data.viewportIndex;
         Session.get('CornerstoneNewImage' + viewportIndex);
 
@@ -31,7 +30,6 @@ Template.studySeriesQuickSwitch.helpers({
     },
 
     currentTimepoint() {
-        console.log('currentStudy');
         var viewportIndex = Template.instance().data.viewportIndex;
         Session.get('CornerstoneNewImage' + viewportIndex);
 

Packages/lesiontracker/client/components/studySeriesQuickSwitch/studySeriesQuickSwitch.styl

@@ -30,6 +30,8 @@ $switchWrapperWidth = 140px
         opacity: 0
       .switchHover
         opacity: 0.8
+      .studyHover
+        transform(scale(1))
 
     .label
       color: $textSecondaryColor
@@ -114,22 +116,22 @@ $switchWrapperWidth = 140px
 $switchSizeSmall = 35px
 
 @media screen and (max-width: 1024px)
-  .switchSection:hover .switchHover
+  .switchSection:hover .seriesHover
     transform(scale(0.5))
 @media screen and (min-width: 1025px) and (max-width: 1152px)
-  .switchSection:hover .switchHover
+  .switchSection:hover .seriesHover
     transform(scale(0.6))
 @media screen and (min-width: 1153px) and (max-width: 1280px)
-  .switchSection:hover .switchHover
+  .switchSection:hover .seriesHover
     transform(scale(0.7))
 @media screen and (min-width: 1281px) and (max-width: 1440px)
-  .switchSection:hover .switchHover
+  .switchSection:hover .seriesHover
     transform(scale(0.8))
 @media screen and (min-width: 1441px) and (max-width: 1600px)
-  .switchSection:hover .switchHover
+  .switchSection:hover .seriesHover
     transform(scale(0.9))
 @media screen and (min-width: 1601px)
-  .switchSection:hover .switchHover
+  .switchSection:hover .seriesHover
     transform(scale(1))
 
 @media screen and (max-width: 1600px)

Packages/lesiontracker/client/components/studyTimepointBrowser/studyTimepoint.html

@@ -1,8 +1,8 @@
 <template name="studyTimepoint">
     <div class="studyTimepointWrapper">
         <div class="studyTimepoint">
-            {{#each studies}}
-                {{>studyTimepointStudy study=this active=isActive}}
+            {{#each study in studies}}
+                {{>studyTimepointStudy study=study active=(isActive study) viewportIndex=viewportIndex}}
             {{/each}}
         </div>
     </div>

Packages/lesiontracker/client/components/studyTimepointBrowser/studyTimepoint.js

@@ -54,11 +54,11 @@ Template.studyTimepoint.events({
 });
 
 Template.studyTimepoint.helpers({
-    isActive() {
-        if (!this.studyInstanceUid) {
+    isActive(study) {
+        if (!study.studyInstanceUid) {
             return;
         }
 
-        return isActive[this.studyInstanceUid];
+        return isActive[study.studyInstanceUid];
     }
-})
+})

Packages/lesiontracker/client/components/studyTimepointBrowser/studyTimepointBrowser.html

@@ -17,7 +17,7 @@
                                 </div>
                                 <div class="timepointModalities">{{modalitiesSummary timepoint}}</div>
                             </div>
-                            {{>studyTimepoint studies=(studies timepoint) index=@index}}
+                            {{>studyTimepoint studies=(studies timepoint) index=@index viewportIndex=viewportIndex}}
                         </div>
                         <hr class="m-y-1">
                     {{/if}}

Packages/lesiontracker/client/components/studyTimepointBrowser/studyTimepointStudy.html

@@ -16,7 +16,7 @@
         </div>
         <div class="studyTimepointThumbnails">
             {{#each thumbnail in (thumbnails this.study)}}
-                {{>thumbnailEntry thumbnail}}
+                {{>thumbnailEntry thumbnail=thumbnail viewportIndex=viewportIndex}}
             {{/each}}
         </div>
     </div>