Updates to save viewport data across sessions / while switching tabs
This commit is contained in:
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);
|
||||
},
|
||||
|
||||
+1
-1
@@ -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 }}
|
||||
|
||||
+68
-45
@@ -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];
|
||||
}
|
||||
});
|
||||
Reference in new issue
Block a user