LT-251: Showing only the active timepoint and creating 'Show additional timepoints' button and behavior

Packages/viewerbase/client/components/studyBrowser/studyBrowser/studyBrowser.html

@@ -2,7 +2,7 @@
     <div class="studyBrowser">
         <div class="scrollableStudyThumbnails">
             {{#each study in studies}}
-                {{#each thumbnail in thumbnails}}
+                {{#each thumbnail in (studyThumbnails study)}}
                     {{>thumbnailEntry thumbnail=thumbnail}}
                 {{/each}}
             {{/each}}

Packages/viewerbase/client/components/studyBrowser/studyBrowser/studyBrowser.js

@@ -1,18 +1,7 @@
 Template.studyBrowser.helpers({
-    studies : function() {
-        return ViewerStudies.find({selected: true});
-    },
-    thumbnails: function() {
-        var study = this;
-        var stacks = createStacks(study);
-
-        var array = [];
-        stacks.forEach(function(stack, index) {
-            array.push({
-                thumbnailIndex: index,
-                stack: stack
-            });
+    studies() {
+        return ViewerStudies.find({
+            selected: true
         });
-        return array;
     }
-});
+});

Packages/viewerbase/lib/helpers/logical.js

@@ -1,55 +1,64 @@
-Template.registerHelper('choose', function() {
-    let result;
-    _.each(_.initial(arguments, 1), function(value) {
-        return value && (result = value);
-    });
-    return result;
-});
+/**
+ * Global Blaze UI helpers to work with logical operations
+ */
 
-Template.registerHelper('bool', function(value) {
+// Convert any value into a boolean value
+Template.registerHelper('bool', value => {
     return !!value;
 });
 
-Template.registerHelper('eq', function(a, b) {
+// Check if two values are identical
+Template.registerHelper('eq', (a, b) => {
     return a === b;
 });
 
-Template.registerHelper('ne', function(a, b) {
+// Check if two values are different
+Template.registerHelper('ne', (a, b) => {
     return a === b;
 });
 
-Template.registerHelper('gt', function(a, b) {
+// Check if the first value is greater than the second one
+Template.registerHelper('gt', (a, b) => {
     return a > b;
 });
 
-Template.registerHelper('lt', function(a, b) {
+// Check if the first value is lesser than the second one
+Template.registerHelper('lt', (a, b) => {
     return a < b;
 });
 
-Template.registerHelper('gte', function(a, b) {
+// Check if the first value is greater than or equals the second one
+Template.registerHelper('gte', (a, b) => {
     return a >= b;
 });
 
-Template.registerHelper('lte', function(a, b) {
+// Check if the first value is lesser than or equals the second one
+Template.registerHelper('lte', (a, b) => {
     return a <= b;
 });
 
-Template.registerHelper('not', function(value) {
+// Get the boolean negation for the given value
+Template.registerHelper('not', value => {
     return !value;
 });
 
-Template.registerHelper('and', function() {
+// Check if all the given values are true
+Template.registerHelper('and', (...values) => {
     let result = true;
-    _.each(_.initial(arguments, 1), function(value) {
-        return value || (result = false);
-    });
+    _.each(_.initial(values, 1), value => value || (result = false));
     return result;
 });
 
-Template.registerHelper('or', function() {
+// Check if one of the given values is true
+Template.registerHelper('or', (...values) => {
     let result = false;
-    _.each(_.initial(arguments, 1), function(value) {
-        return value && (result = true);
-    });
+    _.each(_.initial(values, 1), value => value && (result = true));
+    return result;
+});
+
+// Choose the first truthy value in the given values
+Template.registerHelper('choose', (...values) => {
+    let result;
+    _.each(_.initial(values, 1), value => value && (result = value));
     return result;
 });

Packages/viewerbase/lib/helpers/studyThumbnails.js

@@ -0,0 +1,20 @@
+/**
+ * A global Blaze UI helper to get the thumbnails for the given study
+ */
+Template.registerHelper('studyThumbnails', study => {
+    // Creates the series stacks
+    const stacks = createStacks(study);
+
+    // Defines the resulting thumbnails list
+    const thumbnails = [];
+
+    // Iterate over the stacks and add one by one with its index
+    _.each(stacks, (stack, index) => {
+        thumbnails.push({
+            thumbnailIndex: index,
+            stack: stack
+        });
+    });
+
+    return thumbnails;
+});

Packages/viewerbase/package.js

@@ -189,6 +189,7 @@ Package.onUse(function(api) {
         'lib/helpers/objectEach.js',
         'lib/helpers/ifTypeIs.js',
         'lib/helpers/prettyPrintStringify.js',
+        'lib/helpers/studyThumbnails.js',
         'lib/helpers/formatPN.js'
     ], 'client');
     api.export('formatPN', 'client');