Work on refactoring measurements out of Lesion Tracker package
- Removed AssociatedStudies Collection - Measurement API is generated from configuration files - Data exchange methods are defined in configuration
This commit is contained in:
1 parent
c511edd419
commit
ab4d4c9008
537 files changed
+5122
-3545
No files matched your search
+42
@@ -0,0 +1,42 @@
|
||||
<template name="studySeriesQuickSwitch">
|
||||
<div class="quickSwitchWrapper {{side}}">
|
||||
<div class="quickSwitch js-quick-switch clearfix rp-t-1 {{#if eq side 'right'}}rp-l-3{{/if}}{{#if eq side 'left'}}rp-r-3{{/if}}">
|
||||
<div class="switchSection switchSectionStudy rp-x-1 {{#if eq side 'right'}}pull-left{{else}}pull-right{{/if}}">
|
||||
<div class="label">Study</div>
|
||||
<div class="studySwitch">
|
||||
<div class="studyBox"></div>
|
||||
<div class="switchHover studyHover clearfix">
|
||||
<div class="scrollArea">
|
||||
{{>studyTimepointBrowser (clone this timepointViewType='key')}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="switchSection switchSectionSeries rp-x-1 {{#if eq side 'right'}}pull-left{{else}}pull-right{{/if}}">
|
||||
{{#let thumbnailsList=(studyThumbnails currentStudy)}}
|
||||
<div class="label">Series</div>
|
||||
<div class="seriesSwitch clearfix">
|
||||
{{#each thumbnail in thumbnailsList}}
|
||||
{{#if lt @index 8}}
|
||||
<div class="seriesItem {{#if eq side 'right'}}pull-left{{else}}pull-right{{/if}} {{#if isDisplaySetActive thumbnail.stack.displaySetInstanceUid viewportIndex}}active{{/if}}"></div>
|
||||
{{else}}
|
||||
{{#if eq @index 8}}
|
||||
<div class="seriesItem count {{#if eq side 'right'}}pull-left{{else}}pull-right{{/if}}">{{thumbnailsList.length}}</div>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
{{/each}}
|
||||
<div class="switchHover seriesHover clearfix">
|
||||
<div class="scrollArea">
|
||||
<div class="thumbnailsWrapper">
|
||||
{{#each thumbnail in thumbnailsList}}
|
||||
{{>thumbnailEntry (clone this thumbnail=thumbnail)}}
|
||||
{{/each}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{/let}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
+45
@@ -0,0 +1,45 @@
|
||||
Template.studySeriesQuickSwitch.onCreated(() => {
|
||||
const instance = Template.instance();
|
||||
|
||||
// Defines the study being shown in the current viewport
|
||||
instance.data.currentStudy = new ReactiveVar();
|
||||
|
||||
// Gets the viewport data for the given viewport index
|
||||
instance.getViewportData = viewportIndex => {
|
||||
const layoutManager = window.layoutManager;
|
||||
return layoutManager && layoutManager.viewportData && layoutManager.viewportData[viewportIndex];
|
||||
};
|
||||
|
||||
// Gets the current viewport data
|
||||
const viewportIndex = instance.data.viewportIndex;
|
||||
const viewportData = instance.getViewportData(viewportIndex);
|
||||
if (!viewportData) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Finds the current study and return it
|
||||
const study = ViewerStudies.findOne({
|
||||
studyInstanceUid: viewportData.studyInstanceUid
|
||||
});
|
||||
|
||||
// Change the current study to update the thumbnails
|
||||
instance.data.currentStudy.set(study);
|
||||
});
|
||||
|
||||
Template.studySeriesQuickSwitch.events({
|
||||
'mouseenter .js-quick-switch, mouseenter .js-quick-switch .switchSectionSeries'(event, instance) {
|
||||
instance.$('.quickSwitchWrapper').addClass('overlay');
|
||||
$(event.currentTarget).addClass('hover');
|
||||
},
|
||||
'mouseleave .js-quick-switch'(event, instance) {
|
||||
instance.$('.js-quick-switch, .switchSectionSeries').removeClass('hover');
|
||||
instance.$('.quickSwitchWrapper').removeClass('overlay');
|
||||
}
|
||||
});
|
||||
|
||||
Template.studySeriesQuickSwitch.helpers({
|
||||
// Get the current study
|
||||
currentStudy() {
|
||||
return Template.instance().data.currentStudy.get();
|
||||
}
|
||||
});
|
||||
+249
@@ -0,0 +1,249 @@
|
||||
@import "{design}/app"
|
||||
|
||||
$switchSize = 55px
|
||||
$seriesSpacing = 2px
|
||||
|
||||
.quickSwitchWrapper
|
||||
position: fixed
|
||||
top: 0
|
||||
z-index: 1
|
||||
|
||||
&.middle
|
||||
left: 50%
|
||||
|
||||
.quickSwitch
|
||||
transform(translateX(-50%))
|
||||
|
||||
&.left
|
||||
theme('border-right', '1px solid $uiBorderColor')
|
||||
right: 50%
|
||||
|
||||
&.right
|
||||
left: 50%
|
||||
|
||||
&.overlay .quickSwitch
|
||||
transition(z-index 0s linear 0s)
|
||||
z-index: 3
|
||||
|
||||
&:before
|
||||
theme('background-color', '$primaryBackgroundColor')
|
||||
bottom: 0
|
||||
content: ''
|
||||
left: 0
|
||||
opacity: 0
|
||||
position: fixed
|
||||
right: 0
|
||||
top: 0
|
||||
transition(opacity 0.3s ease\, visibility 0s linear 0.3s)
|
||||
visibility: hidden
|
||||
z-index: 2
|
||||
|
||||
&.overlay:before
|
||||
opacity: 0.8
|
||||
transition(opacity 0.3s ease\, visibility 0s linear 0s)
|
||||
visibility: visible
|
||||
|
||||
.quickSwitch
|
||||
position: relative
|
||||
transition(z-index 0s linear 0.3s)
|
||||
z-index: 1
|
||||
|
||||
.switchSection
|
||||
display: inline-block
|
||||
float: left
|
||||
height: 100%
|
||||
position: relative
|
||||
|
||||
&.switchSectionSeries.hover, &.switchSectionStudy:hover
|
||||
.seriesSwitch .seriesItem
|
||||
opacity: 0
|
||||
.switchHover
|
||||
opacity: 1
|
||||
.studyHover
|
||||
height: auto
|
||||
padding-top: $switchSize
|
||||
transition(padding-top 0.3s ease\, visibility 0s linear 0s)
|
||||
visibility: visible
|
||||
|
||||
&.switchSectionSeries.hover
|
||||
.seriesHover
|
||||
.thumbnailsWrapper
|
||||
transform(scale(0.9) translateY($switchSize))
|
||||
transition(all 0.3s ease)
|
||||
.thumbnailEntry .seriesDetails
|
||||
opacity: 0
|
||||
visibility: hidden
|
||||
|
||||
&:hover .seriesHover
|
||||
.thumbnailsWrapper
|
||||
transform(scale(1) translateY(0))
|
||||
.thumbnailEntry .seriesDetails
|
||||
opacity: 1
|
||||
transform(translateY(0))
|
||||
transition(all 0.3s ease)
|
||||
transition-delay(0.3s)
|
||||
visibility: visible
|
||||
|
||||
.seriesHover .thumbnailEntry .seriesDetails
|
||||
opacity: 0
|
||||
transform(translateY(-36px))
|
||||
|
||||
.seriesSwitch .seriesItem
|
||||
transition(opacity 0.3s ease)
|
||||
|
||||
.studySwitch, .seriesSwitch
|
||||
position: relative
|
||||
|
||||
.studySwitch
|
||||
.studyTimepointBrowser
|
||||
background-color: transparent
|
||||
.studyTimepointStudy.active .studyModality
|
||||
theme('box-shadow', 'inset 0 0 0 3px $activeColor')
|
||||
.studyBox
|
||||
theme('background-color', '$uiGrayDark')
|
||||
theme('border', 'solid 1px $activeColor')
|
||||
border-radius: 11px
|
||||
display: block
|
||||
height: $switchSize
|
||||
width: $switchSize
|
||||
|
||||
.seriesSwitch
|
||||
display: block
|
||||
height: $switchSize + $seriesSpacing
|
||||
width: $switchSize + $seriesSpacing
|
||||
|
||||
.seriesItem
|
||||
theme('background-color', '$boxBackgroundColor')Dark
|
||||
border-radius: 3px
|
||||
height: 15px
|
||||
margin: $seriesSpacing
|
||||
width: 15px
|
||||
|
||||
&.count
|
||||
background-color: transparent
|
||||
theme('color', '$textPrimaryColor')
|
||||
font-size: 12px
|
||||
font-weight: 500
|
||||
line-height: 17px
|
||||
text-align: center
|
||||
|
||||
&.active
|
||||
theme('background-color', '$activeColor')
|
||||
|
||||
.label
|
||||
theme('color', '$textSecondaryColor')
|
||||
display: block
|
||||
font-size: 12px
|
||||
font-weight: 300
|
||||
line-height: 34px
|
||||
padding: 0
|
||||
text-align: center
|
||||
text-transform: uppercase
|
||||
|
||||
.switchHover
|
||||
border: 10px solid transparent
|
||||
border-radius: 5px
|
||||
margin: -10px
|
||||
opacity: 0
|
||||
overflow: hidden
|
||||
position: absolute
|
||||
top: 0
|
||||
z-index: 10000
|
||||
|
||||
.scrollArea
|
||||
margin-right: -20px
|
||||
min-height: 200px
|
||||
max-height: 500px
|
||||
overflow-x: hidden
|
||||
overflow-y: scroll
|
||||
width: calc(100% + 20px)
|
||||
|
||||
.studyHover
|
||||
height: 0
|
||||
padding-top: 0
|
||||
transition(padding-top 0.3s ease\, visibility 0s linear 0.3s)
|
||||
visibility: hidden
|
||||
width: 320px
|
||||
|
||||
.scrollArea
|
||||
height: 500px
|
||||
|
||||
.seriesHover
|
||||
transform(scale(0))
|
||||
transition(all 0.3s ease)
|
||||
width: 731px
|
||||
|
||||
.thumbnailEntry
|
||||
margin: 0
|
||||
|
||||
.quickSwitchWrapper.left, .quickSwitchWrapper.middle
|
||||
.seriesHover .thumbnailEntry
|
||||
float: right
|
||||
.studyHover
|
||||
left: 0
|
||||
.seriesHover, .thumbnailsWrapper
|
||||
right: 0
|
||||
transform-origin(100% 0%)
|
||||
|
||||
.quickSwitchWrapper.right
|
||||
.seriesHover .thumbnailEntry
|
||||
float: left
|
||||
.studyHover
|
||||
right: 0
|
||||
.seriesHover, .thumbnailsWrapper
|
||||
left: 0
|
||||
transform-origin(0% 0%)
|
||||
|
||||
// Responsive layout
|
||||
$switchSmallSize = 35px
|
||||
$seriesSmallSpacing = 1px
|
||||
|
||||
@media screen and (max-width: 1023px)
|
||||
.switchSectionSeries.hover .seriesHover
|
||||
transform(scale(0.5))
|
||||
@media screen and (min-width: 1024px) and (max-width: 1151px)
|
||||
.switchSectionSeries.hover .seriesHover
|
||||
transform(scale(0.61))
|
||||
@media screen and (min-width: 1152px) and (max-width: 1279px)
|
||||
.switchSectionSeries.hover .seriesHover
|
||||
transform(scale(0.69))
|
||||
@media screen and (min-width: 1280px) and (max-width: 1359px)
|
||||
.switchSectionSeries.hover .seriesHover
|
||||
transform(scale(0.77))
|
||||
@media screen and (min-width: 1360px) and (max-width: 1439px)
|
||||
.switchSectionSeries.hover .seriesHover
|
||||
transform(scale(0.82))
|
||||
@media screen and (min-width: 1440px) and (max-width: 1599px)
|
||||
.switchSectionSeries.hover .seriesHover
|
||||
transform(scale(0.87))
|
||||
@media screen and (min-width: 1600px) and (max-width: 1919px)
|
||||
.switchSectionSeries.hover .seriesHover
|
||||
transform(scale(0.97))
|
||||
@media screen and (min-width: 1920px)
|
||||
.switchSectionSeries.hover .seriesHover
|
||||
transform(scale(1))
|
||||
|
||||
@media screen and (max-width: 1599px)
|
||||
.quickSwitch
|
||||
.switchSection
|
||||
.label
|
||||
font-size: 8px
|
||||
font-weight: 400
|
||||
line-height: 12px
|
||||
padding: 0
|
||||
.studySwitch .studyBox
|
||||
border-radius: 7px
|
||||
height: $switchSmallSize
|
||||
width: $switchSmallSize
|
||||
.seriesSwitch
|
||||
height: $switchSmallSize + $seriesSmallSpacing
|
||||
width: $switchSmallSize + $seriesSmallSpacing
|
||||
.seriesItem
|
||||
border-radius: 2px
|
||||
height: 10px
|
||||
margin: $seriesSmallSpacing
|
||||
width: 10px
|
||||
&.count
|
||||
font-size: 10px
|
||||
font-weight: 300
|
||||
line-height: 10px
|
||||
Reference in new issue
Block a user