Updates to save viewport data across sessions / while switching tabs

This commit is contained in:
Erik Ziegler committed 2015-10-23 14:08:51 +02:00
1 parent 56417df385
commit 4721400b34
27 files changed
+585 -204

No files matched your search

@@ -1,5 +1,5 @@
<template name="layout">
<nav class="navbar navbar-default" role="navigation">
<nav class="navbar navbar-default noselect" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
@@ -1,3 +1,11 @@
.noselect
-webkit-touch-callout: none
-webkit-user-select: none
-khtml-user-select: none
-moz-user-select: none
-ms-user-select: none
user-select: none
.navbar
margin-bottom: 0
border-radius: 0
@@ -28,7 +28,15 @@ function displayReferenceLines(viewportIndex) {
var element = $('.imageViewerViewport').get(viewportIndex);
$('.imageViewerViewport').each(function(index, element) {
if (!$(this).find('canvas').length) {
var imageId;
try {
var enabledElement = cornerstone.getEnabledElement(element);
imageId = enabledElement.image.imageId;
} catch(error) {
return;
}
if (!imageId || !$(this).find('canvas').length) {
return;
}
@@ -41,14 +49,16 @@ function displayReferenceLines(viewportIndex) {
}
function loadSeriesIntoViewport(data) {
if (!data.series || !data.viewport) {
if (!data.series || !data.element) {
return;
}
var contentId = $("#viewer").parents('.tab-pane.active').attr('id');
var study = data.study;
var series = data.series;
var element = data.viewport;
var viewportIndex = $(".imageViewerViewport").index(data.viewport);
var element = data.element;
var viewportIndex = $(".imageViewerViewport").index(element);
var allEvents = 'CornerstoneToolsMouseDown CornerstoneToolsMouseDownActivate ' +
'CornerstoneToolsMouseClick CornerstoneToolsMouseDrag CornerstoneToolsMouseUp ' +
@@ -72,7 +82,7 @@ function loadSeriesIntoViewport(data) {
});
var stack = {
currentImageIdIndex: 0,
currentImageIdIndex: data.currentImageIdIndex || 0,
imageIds: imageIds
};
@@ -86,13 +96,28 @@ function loadSeriesIntoViewport(data) {
// If you have problems, replace it with this line instead:
// cornerstone.enable(element);
var startLoadingHandler = cornerstoneTools.loadHandlerManager.getStartLoadHandler();
var endLoadingHandler = cornerstoneTools.loadHandlerManager.getEndLoadHandler();
var errorLoadingHandler = cornerstoneTools.loadHandlerManager.getErrorLoadingHandler();
if (startLoadingHandler) {
startLoadingHandler(element);
}
cornerstone.loadAndCacheImage(imageId).then(function(image) {
cornerstone.displayImage(element, image);
if (data.viewport) {
cornerstone.displayImage(element, image, data.viewport);
} else {
cornerstone.displayImage(element, image);
}
if (endLoadingHandler) {
endLoadingHandler(element);
}
element.classList.remove('empty');
$(element).siblings('.viewportInstructions').hide();
$(element).siblings('.imageViewerViewportOverlay').show();
cornerstone.resize(element, true);
var imagePlane = cornerstoneTools.metaData.get('imagePlane', image.imageId);
@@ -118,6 +143,9 @@ function loadSeriesIntoViewport(data) {
function onImageRendered(e, eventData) {
Session.set('CornerstoneImageRendered' + viewportIndex, Random.id());
var viewport = cornerstone.getViewport(element);
ViewerData[contentId].viewer.imageViewerLoadedSeriesDictionary[viewportIndex].viewport = viewport;
Session.set('ViewerData', ViewerData);
}
$(element).off('CornerstoneImageRendered', onImageRendered);
@@ -129,13 +157,20 @@ function loadSeriesIntoViewport(data) {
// This allows the template helpers to update reactively
templateData.imageId = eventData.enabledElement.image.imageId;
Session.set('CornerstoneNewImage' + viewportIndex, Random.id());
var stack = cornerstoneTools.getToolState(element, 'stack');
if (stack && stack.data.length && stack.data[0].imageIds.length > 1) {
var imageIdIndex = stack.data[0].imageIds.indexOf(templateData.imageId);
ViewerData[contentId].viewer.imageViewerLoadedSeriesDictionary[viewportIndex].currentImageIdIndex = imageIdIndex;
Session.set('ViewerData', ViewerData);
}
}
$(element).off('CornerstoneNewImage', onNewImage);
$(element).on('CornerstoneNewImage', onNewImage);
function sendActivationTrigger(e, eventData) {
var activeViewportIndex = Session.get('ActiveViewport');
var activeViewportIndex = data.activeViewport.curValue;
var viewportIndex = $(".imageViewerViewport").index(eventData.element);
if (viewportIndex === activeViewportIndex) {
return;
@@ -151,61 +186,62 @@ function loadSeriesIntoViewport(data) {
Session.set('CornerstoneNewImage' + viewportIndex, Random.id());
OHIF.viewer.imageViewerLoadedSeriesDictionary[viewportIndex] = {
studyInstanceUid: data.studyInstanceUid,
seriesInstanceUid: data.seriesInstanceUid,
currentImageIdIndex: data.currentImageIdIndex,
viewport: viewport
};
if (OHIF.viewer.refLinesEnabled && imagePlane && imagePlane.frameOfReferenceUID) {
OHIF.viewer.updateImageSynchronizer.add(element);
displayReferenceLines(viewportIndex);
}
}, function(error) {
if (errorLoadingHandler) {
errorLoadingHandler(element, imageId, error);
}
});
}
Template.imageViewerViewport.onRendered(function() {
var studies = this.data.studies;
var viewport = this.find(".imageViewerViewport");
var viewportIndex = $(".imageViewerViewport").index(viewport);
this.data.viewportIndex = viewportIndex;
var element = this.find(".imageViewerViewport");
var data = {
viewport: viewport
element: element,
viewport: this.data.viewport,
currentImageIdIndex: this.data.currentImageIdIndex,
activeViewport: this.data.activeViewport,
studyInstanceUid: this.data.studyInstanceUid,
seriesInstanceUid: this.data.seriesInstanceUid
};
if (this.data.seriesInstanceUid !== undefined && this.data.studyInstanceUid !== undefined) {
var studyInstanceUid = this.data.studyInstanceUid;
var seriesInstanceUid = this.data.seriesInstanceUid;
studies.every(function(study) {
if (study.studyInstanceUid === studyInstanceUid) {
data.study = study;
study.seriesList.every(function(series) {
if (series.seriesInstanceUid === seriesInstanceUid) {
data.series = series;
return false;
}
return true;
});
return false;
}
return true;
});
} else {
var stacks = [];
studies.forEach(function(study) {
study.seriesList.forEach(function(series) {
var stack = {
series: series,
study: study
};
stacks.push(stack);
});
});
if (viewportIndex >= stacks.length) {
viewport.classList.add('empty');
$(viewport).siblings('.viewportInstructions').show();
return;
}
data.series = stacks[viewportIndex].series;
data.study = stacks[viewportIndex].study;
if (this.data.seriesInstanceUid === undefined || this.data.studyInstanceUid === undefined) {
element.classList.add('empty');
$(element).siblings('.viewportInstructions').show();
return;
}
var studyInstanceUid = this.data.studyInstanceUid;
var seriesInstanceUid = this.data.seriesInstanceUid;
studies.every(function(study) {
if (study.studyInstanceUid === studyInstanceUid) {
data.study = study;
study.seriesList.every(function(series) {
if (series.seriesInstanceUid === seriesInstanceUid) {
data.series = series;
return false;
}
return true;
});
return false;
}
return true;
});
loadSeriesIntoViewport(data);
});
@@ -216,11 +252,11 @@ Template.imageViewerViewport.onDestroyed(function() {
Template.imageViewerViewport.events({
'ActivateViewport .imageViewerViewport': function(e) {
if (this.viewportIndex === this.activeViewport.get()) {
if (this.viewportIndex === this.activeViewport.curValue) {
return;
}
console.log('ActivateViewport index: ' + this.viewportIndex);
this.activeViewport.set(this.viewportIndex);
this.activeViewport.curValue = this.viewportIndex;
enablePrefetchOnElement(this.viewportIndex);
displayReferenceLines(this.viewportIndex);
},
@@ -3,7 +3,7 @@
{{ #each viewportArray }}
<div class="viewportContainer" style="height:{{height}}%;width:{{width}}%;">
<div class="removable">
{{ >imageViewerViewport viewportIndex=viewportIndex studies=studies activeViewport=activeViewport}}
{{ >imageViewerViewport viewportIndex=viewportIndex studies=studies activeViewport=activeViewport seriesInstanceUid=seriesInstanceUid studyInstanceUid=studyInstanceUid currentImageIdIndex=currentImageIdIndex viewport=viewport}}
</div>
</div>
{{ /each }}
@@ -1,50 +1,73 @@
Template.imageViewerViewports.helpers({
height: function() {
var viewportRows;
if (!Template.parentData(1).viewportRows) {
viewportRows = 1;
} else {
viewportRows = Template.parentData(1).viewportRows.get();
}
return 100 / viewportRows;
},
width: function() {
var viewportColumns;
if (!Template.parentData(1).viewportColumns) {
viewportColumns = 1;
} else {
viewportColumns = Template.parentData(1).viewportColumns.get();
}
return 100 / viewportColumns;
},
viewportArray: function() {
// This is a really annoying thing to have to do, but Meteor
// doesn't want to let me use another type of helper.
var viewportRows;
if (!this.viewportRows) {
viewportRows = 1;
} else {
viewportRows = this.viewportRows.get();
}
height: function() {
var viewportRows;
if (!Template.parentData(1).viewportRows) {
viewportRows = 1;
} else {
viewportRows = Template.parentData(1).viewportRows.curValue; //Having issues with .get(), not sure why?
}
return 100 / viewportRows;
},
width: function() {
var viewportColumns;
if (!Template.parentData(1).viewportColumns) {
viewportColumns = 1;
} else {
viewportColumns = Template.parentData(1).viewportColumns.curValue; //Having issues with .get(), not sure why?
}
return 100 / viewportColumns;
},
viewportArray: function() {
// This is a really annoying thing to have to do, but Meteor
// doesn't want to let me use another type of helper.
var viewportRows;
if (!this.viewportRows) {
viewportRows = 1;
} else {
viewportRows = this.viewportRows.curValue; //Having issues with .get(), not sure why?
}
var viewportColumns;
if (!this.viewportColumns) {
viewportColumns = 1;
} else {
viewportColumns = this.viewportColumns.get();
}
var numViewports = viewportRows * viewportColumns;
var viewportColumns;
if (!this.viewportColumns) {
viewportColumns = 1;
} else {
viewportColumns = this.viewportColumns.curValue; //Having issues with .get(), not sure why?
}
var viewportData;
if (OHIF && OHIF.viewer && !$.isEmptyObject(OHIF.viewer.imageViewerLoadedSeriesDictionary)) {
viewportData = OHIF.viewer.imageViewerLoadedSeriesDictionary;
}
var array = [];
for (var i=0; i < numViewports; ++i) {
var data = {
viewportIndex: i,
studies: this.studies,
activeViewport: this.activeViewport
var hangingProtocol = getHangingProtocol();
var inputData = {
viewportColumns: viewportColumns,
viewportRows: viewportRows,
studies: this.studies
};
array.push(data);
}
return array;
},
var hangingProtocolViewportData = hangingProtocol(inputData);
var array = [];
var numViewports = viewportRows * viewportColumns;
for (var i=0; i < numViewports; ++i) {
var data = {
viewportIndex: i,
studies: this.studies,
activeViewport: this.activeViewport
};
if (viewportData && viewportData[i]) {
data.seriesInstanceUid = viewportData[i].seriesInstanceUid;
data.studyInstanceUid = viewportData[i].studyInstanceUid;
data.currentImageIdIndex = viewportData[i].currentImageIdIndex;
data.viewport = viewportData[i].viewport;
} else if (hangingProtocolViewportData && hangingProtocolViewportData[i]) {
data.seriesInstanceUid = hangingProtocolViewportData[i].seriesInstanceUid;
data.studyInstanceUid = hangingProtocolViewportData[i].studyInstanceUid;
data.currentImageIdIndex = hangingProtocolViewportData[i].currentImageIdIndex;
data.viewport = hangingProtocolViewportData[i].viewport;
}
array.push(data);
}
return array;
},
});
@@ -37,14 +37,14 @@ Template.layoutChooser.events({
// Add 1 because the indices start from zero
if (this.viewportRows) {
this.viewportRows.set(rowIndex + 1);
this.viewportRows.curValue = rowIndex + 1;
data.viewportRows = this.viewportRows;
} else {
data.viewportRows = 1;
}
if (this.viewportColumns) {
this.viewportColumns.set(columnIndex + 1);
this.viewportColumns.curValue = columnIndex + 1;
data.viewportColumns = this.viewportColumns;
} else {
data.viewportColumns = 1;
@@ -1,7 +1,7 @@
Template.playClipButton.helpers({
'isPlaying': function() {
Session.get('UpdateCINE');
var viewportIndex = this.activeViewport.get();
var viewportIndex = this.activeViewport.curValue;
return !!OHIF.viewer.isPlaying[viewportIndex];
}
});