TrizTech/ohif-viewer
15
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

OHIF-122: Remove hover state in disabled buttons and fix Next/Previous disabled state when layout viewport changes

Browse Source
This commit is contained in:
Eloízio Salgado 2016-11-03 15:15:03 -02:00
parent ca1ed4fb0a
commit 37d12970ab
5 changed files with 41 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
Packages/ohif-core/client/lib/viewer.js
View File

@ -86,7 +86,7 @@ OHIF.viewer.isDisplaySetsSequenced = definedSequenceMap => {
OHIF.viewer.canMoveDisplaySets = isNext => {
// Get the setting that defines if the display set navigation is multiple
const isMultiple = OHIF.uiSettings.displaySetNavigationMultipleViewports;
// Get the setting that allow display set navigation looping over series
const allowLooping = OHIF.uiSettings.displaySetNavigationLoopOverSeries;
@ -101,17 +101,24 @@ OHIF.viewer.canMoveDisplaySets = isNext => {
// Check if the display sets are sequenced
const isSequenced = OHIF.viewer.isDisplaySetsSequenced(sequenceMap);
// Get Active Viewport Index if isMultiple is false
const activeViewportIndex = !isMultiple ? Session.get('activeViewport') : null;
// Check if is next and looping is blocked
if (isNext && !allowLooping) {
// Check if the end was reached
let endReached = true;
sequenceMap.forEach((studyViewports, study) => {
const firstIndex = studyViewports[0].displaySetIndex;
const steps = studyViewports.length;
// Get active viewport index if isMultiple is false ortherwise get last
const viewportIndex = studyViewports[activeViewportIndex !== null ? activeViewportIndex : studyViewports.length - 1].displaySetIndex;
const layoutViewports = studyViewports.length;
const amount = study.displaySets.length;
const move = (amount % steps) || steps;
const move = !isMultiple ? 1 : ((amount % layoutViewports) || layoutViewports);
const lastStepIndex = amount - move;
if (firstIndex + steps !== lastStepIndex + steps) {
// 9999 for index means empty viewport, see getDisplaySetSequenceMap function
if (viewportIndex !== 9999 && viewportIndex !== lastStepIndex) {
endReached = false;
}
});
@ -126,13 +133,19 @@ OHIF.viewer.canMoveDisplaySets = isNext => {
if (!isNext && !allowLooping) {
// Check if the begin was reached
let beginReached = true;
sequenceMap.forEach((studyViewports, study) => {
const firstIndex = studyViewports[0].displaySetIndex;
const steps = studyViewports.length;
if (firstIndex - steps !== -steps) {
beginReached = false;
}
});
if(activeViewportIndex >= 0) {
sequenceMap.forEach((studyViewports, study) => {
// Get active viewport index if isMultiple is false ortherwise get first
const viewportIndex = studyViewports[activeViewportIndex !== null ? activeViewportIndex : 0].displaySetIndex;
const layoutViewports = studyViewports.length;
// 9999 for index means empty viewport, see getDisplaySetSequenceMap function
if (viewportIndex !== 9999 && viewportIndex - layoutViewports !== -layoutViewports) {
beginReached = false;
}
});
}
// Return false if begin is not reached yet
if ((!isMultiple || isSequenced) && beginReached) {

1
Packages/viewerbase/client/components/viewer/displaySetNavigation/displaySetNavigation.js
View File

@ -21,6 +21,7 @@ Template.displaySetNavigation.events({
Template.displaySetNavigation.helpers({
disableButton(isNext) {
OHIF.uiSettings.displaySetNavigationMultipleViewports = false;
Session.get('LayoutManagerUpdated');
return !OHIF.viewer.canMoveDisplaySets(isNext);
}

12
Packages/viewerbase/client/components/viewer/layoutChooser/layoutChooser.js
View File

@ -9,20 +9,20 @@ Template.layoutChooser.onRendered(() => {
* @param currentCell
*/
instance.highlightCells = currentCell => {
const cells = $('.layoutChooser table td');
const cells = this.$('.layoutChooser table td');
cells.removeClass('hover');
currentCell = $(currentCell);
currentCell = this.$(currentCell);
const table = currentCell.parents('.layoutChooser table').get(0);
const rowIndex = currentCell.closest('tr').index();
const columnIndex = currentCell.index();
// Loop through the table row by row
// and cell by cell to apply the highlighting
for (var i = 0; i < table.rows.length; i++) {
for (let i = table.rows.length - 1; i >= 0; i--) {
const row = table.rows[i];
if (i <= rowIndex) {
for (var j = 0; j < row.cells.length; j++) {
for (let j = row.cells.length - 1; j >= 0; j--) {
if (j <= columnIndex) {
const cell = row.cells[j];
cell.classList.add('hover');
@ -67,7 +67,7 @@ Template.layoutChooser.events({
},
'click .layoutChooser table td'(event, instance) {
const $currentCell = $(event.currentTarget);
const $currentCell = instance.$(event.currentTarget);
const rowIndex = $currentCell.closest('tr').index();
const columnIndex = $currentCell.index();
@ -81,7 +81,7 @@ Template.layoutChooser.events({
window.layoutManager.layoutProps = layoutProps;
window.layoutManager.updateViewports();
const $dropdown = $('.layoutChooser');
const $dropdown = instance.$('.layoutChooser');
toggleDialog($dropdown);
}
});

6
Packages/viewerbase/client/components/viewer/toolbarSectionButton/toolbarSectionButton.styl
View File

@ -12,6 +12,11 @@
&.disabled
opacity: 0.5
cursor: not-allowed
&:hover
i,
.buttonLabel
theme('color', '$textSecondaryColor')
.buttonLabel
theme('color', '$textSecondaryColor')
@ -23,6 +28,7 @@
text-align: center
i
theme('color', '$textSecondaryColor')
font-size: 18px
line-height: 30px

3
Packages/viewerbase/lib/setActiveViewport.js
View File

@ -9,6 +9,9 @@ setActiveViewport = function(element) {
// with the viewport index that it was fired from.
Session.set('activeViewport', viewportIndex);
// Update the Session variable to the UI re-renders
Session.set('LayoutManagerUpdated', Random.id());
// Add the 'active' class to the parent container to highlight the active viewport
$('#imageViewerViewports .viewportContainer').removeClass('active');
$(element).parents('.viewportContainer').addClass('active');