LT-247: Adding behavior for All timepoints option

This commit is contained in:
Bruno Alves de Faria 2016-06-08 08:24:40 -03:00 committed by Erik Ziegler
parent 4e6f46f876
commit d014c72aa4
2 changed files with 27 additions and 5 deletions

View File

@ -4,7 +4,7 @@
<div class="p-x-1"> <div class="p-x-1">
{{#each timepoint in timepoints}} {{#each timepoint in timepoints}}
{{#if shouldShowTimepoint timepoint @index}} {{#if shouldShowTimepoint timepoint @index}}
<div class="timepointEntry p-y-2 active"> <div class="timepointEntry p-y-2">
<div class="timepointHeader"> <div class="timepointHeader">
<div class="timepointDetails clearfix"> <div class="timepointDetails clearfix">
<div class="timepointFollowupTitle pull-left"> <div class="timepointFollowupTitle pull-left">

View File

@ -1,3 +1,18 @@
Template.studyTimepointBrowser.onRendered(() => {
const instance = Template.instance();
instance.autorun(() => {
// Runs this computation everytime the timepointViewType is changed
const type = instance.data.timepointViewType.get();
// Removes all active classes to collapse the timepoints and studies
instance.$('.timepointEntry, .studyTimepointStudy').removeClass('active');
if (type === 'key') {
// Show only first timepoint expanded for key timepoints
instance.$('.timepointEntry:first').addClass('active');
}
});
});
Template.studyTimepointBrowser.events({ Template.studyTimepointBrowser.events({
'click .timepointHeader'(event, instance) { 'click .timepointHeader'(event, instance) {
const $timepoint = $(event.currentTarget).closest('.timepointEntry'); const $timepoint = $(event.currentTarget).closest('.timepointEntry');
@ -11,21 +26,28 @@ Template.studyTimepointBrowser.events({
}); });
Template.studyTimepointBrowser.helpers({ Template.studyTimepointBrowser.helpers({
timepoints: function() { timepoints() {
// Sort timepoints based on timeline and type
const sort = { const sort = {
sort: { sort: {
earliestDate: -1 earliestDate: -1,
timepointType: -1
} }
}; };
// Returns all timepoints with sorting
return Timepoints.find({}, sort); return Timepoints.find({}, sort);
}, },
// Decides if a timepoint should be shown or omitted
shouldShowTimepoint(timepoint, index) { shouldShowTimepoint(timepoint, index) {
const instance = Template.instance(); const instance = Template.instance();
// Show all timepoints when view type is all
if (instance.data.timepointViewType.get() === 'all') { if (instance.data.timepointViewType.get() === 'all') {
return true; return true;
} }
return index < 4 || timepoint.timepointType === 'baseline'; // Show only the latest timepoints and baseline
return index < 3 || timepoint.timepointType === 'baseline';
}, },
// Build the timepoint title based on its date // Build the timepoint title based on its date
timepointTitle(timepoint, total, index) { timepointTitle(timepoint, total, index) {
@ -39,7 +61,7 @@ Template.studyTimepointBrowser.helpers({
2: '(Nadir)' 2: '(Nadir)'
}; };
// TODO: [design] find out how to define the nadir timepoint // TODO: [design] find out how to define the nadir timepoint
const followUp = total - index - 1; const followUp = total - index;
const parenthesis = states[index] || ''; const parenthesis = states[index] || '';
return `Follow-up ${followUp} ${parenthesis}`; return `Follow-up ${followUp} ${parenthesis}`;
} }