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

Re-rendering the thumbnail when external data is changed

Browse Source
This commit is contained in:
Bruno Alves de Faria 2017-03-30 10:56:57 -03:00
parent 41fb606b2a
commit 66dfefbb14
3 changed files with 34 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
Packages/ohif-viewerbase/client/components/studyBrowser/imageThumbnail/imageThumbnail.js
View File

@ -1,11 +1,7 @@
import { Template } from 'meteor/templating';
import { Tracker } from 'meteor/tracker';
import { Session } from 'meteor/session';
// OHIF Modules
import { OHIF } from 'meteor/ohif:core';
// Local Modules
import { getImageId } from '../../../lib/getImageId.js';
import { getWADORSImageId } from '../../../lib/getWADORSImageId.js';
Template.imageThumbnail.onCreated(() => {
const instance = Template.instance();
@ -17,7 +13,7 @@ Template.imageThumbnail.onCreated(() => {
let imageIndex = Math.floor(lastIndex / 2);
let imageInstance;
if(stack.isMultiFrame) {
if (stack.isMultiFrame) {
imageInstance = stack.images[0];
} else {
imageInstance = stack.images[imageIndex];
@ -79,6 +75,9 @@ Template.imageThumbnail.onRendered(() => {
instance.data.currentStudy.dep.depend();
}
// Depend on external data and re-run this computation when it changes
Template.currentData();
// Wait for the new data and refresh the image thumbnail
Tracker.afterFlush(() => instance.refreshImage());
});

50
Packages/ohif-viewerbase/client/components/studyBrowser/thumbnailEntry/thumbnailEntry.js
View File

@ -8,53 +8,56 @@ import { thumbnailDragHandlers } from '../../../lib/thumbnailDragHandlers';
Template.thumbnailEntry.onCreated(() => {
const instance = Template.instance();
// Check if the thumbnails will be draggable or clickable
instance.isDragAndDrop = _.isUndefined(instance.data.viewportIndex);
// Check if the thumbnails will be draggable or clickable
instance.isDragAndDrop = _.isUndefined(instance.data.viewportIndex);
});
Template.thumbnailEntry.events({
// Event handlers for drag and drop
'touchstart .thumbnailEntry, mousedown .thumbnailEntry'(event, instance) {
const data = instance.data.thumbnail.stack;
instance.isDragAndDrop && thumbnailDragHandlers.thumbnailDragStartHandler(event, data);
if (!instance.isDragAndDrop) return;
thumbnailDragHandlers.thumbnailDragStartHandler(event, data);
},
'touchmove .thumbnailEntry'(event, instance) {
instance.isDragAndDrop && thumbnailDragHandlers.thumbnailDragHandler(event);
if (!instance.isDragAndDrop) return;
thumbnailDragHandlers.thumbnailDragHandler(event);
},
'touchend .thumbnailEntry'(event, instance) {
const data = instance.data.thumbnail.stack;
instance.isDragAndDrop && thumbnailDragHandlers.thumbnailDragEndHandler(event, data);
if (!instance.isDragAndDrop) return;
thumbnailDragHandlers.thumbnailDragEndHandler(event, data);
},
// Event handlers for click (quick switch)
'click .thumbnailEntry'(event, instance) {
if (!instance.isDragAndDrop) {
// Get the thumbnail stack data
const data = instance.data.thumbnail.stack;
if (instance.isDragAndDrop) return;
// Rerender the viewport using the clicked thumbnail data
OHIF.viewerbase.layoutManager.rerenderViewportWithNewDisplaySet(instance.data.viewportIndex, data);
}
// Get the thumbnail stack data
const data = instance.data.thumbnail.stack;
// Rerender the viewport using the clicked thumbnail data
OHIF.viewerbase.layoutManager.rerenderViewportWithNewDisplaySet(instance.data.viewportIndex, data);
},
// Event handlers for double click
'dblclick .thumbnailEntry'(event, instance) {
if (instance.isDragAndDrop) {
// Get the active viewport index and total number of viewports...
const viewportCount = OHIF.viewerbase.layoutManager.getNumberOfViewports();
let viewportIndex = Session.get('activeViewport') || 0;
if (viewportIndex >= viewportCount) {
viewportIndex = viewportCount > 0 ? viewportCount - 1 : 0;
}
if (!instance.isDragAndDrop) return;
// Get the thumbnail stack data
const data = instance.data.thumbnail.stack;
// Rerender the viewport using the clicked thumbnail data
OHIF.viewerbase.layoutManager.rerenderViewportWithNewDisplaySet(viewportIndex, data);
// Get the active viewport index and total number of viewports...
const viewportCount = OHIF.viewerbase.layoutManager.getNumberOfViewports();
let viewportIndex = Session.get('activeViewport') || 0;
if (viewportIndex >= viewportCount) {
viewportIndex = viewportCount > 0 ? viewportCount - 1 : 0;
}
// Get the thumbnail stack data
const data = instance.data.thumbnail.stack;
// Rerender the viewport using the clicked thumbnail data
OHIF.viewerbase.layoutManager.rerenderViewportWithNewDisplaySet(viewportIndex, data);
}
});
@ -62,6 +65,7 @@ Template.thumbnailEntry.helpers({
draggableClass() {
return Template.instance().isDragAndDrop ? 'draggable' : '';
},
instanceNumber() {
const thumbnail = Template.instance().data.thumbnail;
if (!thumbnail) {

6
Packages/ohif-viewerbase/client/lib/helpers/studyThumbnails.js
View File

@ -16,10 +16,10 @@ Template.registerHelper('studyThumbnails', study => {
const thumbnails = [];
// Iterate over the stacks and add one by one with its index
_.each(stacks, (stack, index) => {
_.each(stacks, (stack, thumbnailIndex) => {
thumbnails.push({
thumbnailIndex: index,
stack: stack
thumbnailIndex,
stack
});
});