Finishing timepoint browser behavior

This commit is contained in:
Bruno Alves de Faria committed 2017-10-25 22:18:42 -02:00
1 parent d721c0dbde
commit d787ed2cb9
17 files changed
+118 -95

No files matched your search

@@ -17,7 +17,7 @@ Template.studyTimepoint.onRendered(() => {
const $studies = instance.$('.studyTimepoint');
const $wrapper = $studies.closest('.studyTimepointWrapper');
const $timepoint = $wrapper.closest('.timepointEntry');
const $timepoint = $wrapper.closest('.timepoint-item');
const studiesVisible = $studies.is(':visible');
if (!studiesVisible) {
@@ -4,5 +4,5 @@
overflow: hidden
transition($sidebarTransition)
.timepointEntry:not(.active) .studyTimepointWrapper
.timepoint-item:not(.active) .studyTimepointWrapper
max-height: 0 !important
@@ -8,20 +8,22 @@
<div class="p-x-1">
{{#if timepointList.length}}
{{#each timepoint in timepointList}}
<div class="timepointEntry p-y-2">
<div class="timepointHeader">
<div class="timepointDetails clearfix">
<div class="timepointFollowupTitle pull-left">
{{timepointApi.title timepoint}}
<div class="timepoint-browser-item">
<div class="timepoint-item p-y-2">
<div class="timepointHeader">
<div class="timepoint-details clearfix">
<div class="timepoint-title pull-left">
{{timepointApi.title timepoint}}
</div>
<div class="timepoint-expand-icon pull-right">
<i class="fa fa-chevron-down"></i>
</div>
<div class="timepoint-date pull-right m-r-1">{{formatDA timepoint.earliestDate 'D-MMM-YYYY'}}</div>
</div>
<div class="expandIcon pull-right">
<i class="fa fa-chevron-down"></i>
</div>
<div class="timepointDate pull-right m-r-1">{{formatDA timepoint.earliestDate 'D-MMM-YYYY'}}</div>
<div class="timepoint-summary">{{modalitiesSummary timepoint}}</div>
</div>
<div class="timepointModalities">{{modalitiesSummary timepoint}}</div>
{{>studyTimepoint studies=(studies timepoint) index=@index viewportIndex=this.viewportIndex currentStudy=this.currentStudy}}
</div>
{{>studyTimepoint studies=(studies timepoint) index=@index viewportIndex=this.viewportIndex currentStudy=this.currentStudy}}
</div>
<hr>
{{/each}}
@@ -53,10 +53,10 @@ Template.studyTimepointBrowser.onRendered(() => {
const type = instance.timepointViewType.get();
// Removes all active classes to collapse the timepoints and studies
instance.$('.timepointEntry, .study-browser-item').removeClass('active');
instance.$('.timepoint-item, .study-browser-item').removeClass('active');
if (type === 'key' && !instance.data.currentStudy) {
// Show only first timepoint expanded for key timepoints
instance.$('.timepointEntry:first').addClass('active');
instance.$('.timepoint-item:first').addClass('active');
}
});
@@ -70,7 +70,7 @@ Template.studyTimepointBrowser.onRendered(() => {
instance.$(`.study-browser-item[data-uid='${studyInstanceUid}']`).addClass('active');
});
// Show only first timepoint expanded for key timepoints
instance.$('.timepointEntry:first').addClass('active');
instance.$('.timepoint-item:first').addClass('active');
});
instance.autorun(() => {
@@ -95,7 +95,7 @@ Template.studyTimepointBrowser.onRendered(() => {
Template.studyTimepointBrowser.events({
'click .timepointHeader'(event, instance) {
const $timepoint = $(event.currentTarget).closest('.timepointEntry');
const $timepoint = $(event.currentTarget).closest('.timepoint-item');
// Recalculates the timepoint height to make CSS transition smoother
$timepoint.find('.studyTimepoint').trigger('displayStateChanged');