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

LT-40: Placing the text call-outs always inside canvas when zoomed

Browse Source
This commit is contained in:
Bruno Alves de Faria 2016-11-24 18:48:36 -02:00
parent e2ae778844
commit 0be7fc270f
1 changed files with 30 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
Packages/ohif-core/client/lib/cornerstone.js
View File

@ -60,6 +60,21 @@ OHIF.cornerstone.repositionTextBoxWhileDragging = (eventData, measurementData) =
return result; return result;
}; };
const calculateAxisCenter = (axis, start, end) => {
const a = start[axis];
const b = end[axis];
const lowest = Math.min(a, b);
const highest = Math.max(a, b);
return lowest + ((highest - lowest) / 2);
};
const getTextBoxSizeInPixels = (element, axis, bounds) => {
const topLeft = cornerstone.pageToPixel(element, 0, 0);
const bottomRight = cornerstone.pageToPixel(element, bounds.x, bounds.y);
const boxSize = bottomRight[axis] - topLeft[axis];
return boxSize;
};
const modifiedCallback = () => { const modifiedCallback = () => {
const handles = measurementData.handles; const handles = measurementData.handles;
const textBox = handles.textBox; const textBox = handles.textBox;
@ -72,17 +87,9 @@ OHIF.cornerstone.repositionTextBoxWhileDragging = (eventData, measurementData) =
const start = getHandlePosition('start'); const start = getHandlePosition('start');
const end = getHandlePosition('end'); const end = getHandlePosition('end');
const calculateAxisCenter = axis => {
const a = start[axis];
const b = end[axis];
const lowest = Math.min(a, b);
const highest = Math.max(a, b);
return lowest + ((highest - lowest) / 2);
};
const tool = {}; const tool = {};
tool.x = calculateAxisCenter('x'); tool.x = calculateAxisCenter('x', start, end);
tool.y = calculateAxisCenter('y'); tool.y = calculateAxisCenter('y', start, end);
const mid = {}; const mid = {};
mid.x = image.width / 2; mid.x = image.width / 2;
@ -124,6 +131,15 @@ OHIF.cornerstone.repositionTextBoxWhileDragging = (eventData, measurementData) =
if (foundPlace) { if (foundPlace) {
_.extend(directions, tempDirections); _.extend(directions, tempDirections);
cornerAxis = tempCornerAxis; cornerAxis = tempCornerAxis;
} else {
const $canvas = $(enabledElement.canvas);
const offset = $canvas.offset();
const position = {
x: directions.x < 0 ? offset.left : offset.left + $canvas.outerWidth(),
y: directions.y < 0 ? offset.top : offset.top + $canvas.outerHeight()
};
const pixelPosition = cornerstone.pageToPixel(element, position.x, position.y);
points[cornerAxis] = pixelPosition[cornerAxis];
} }
const toolAxis = cornerAxis === 'x' ? 'y' : 'x'; const toolAxis = cornerAxis === 'x' ? 'y' : 'x';
@ -131,10 +147,10 @@ OHIF.cornerstone.repositionTextBoxWhileDragging = (eventData, measurementData) =
textBox[cornerAxis] = points[cornerAxis]; textBox[cornerAxis] = points[cornerAxis];
textBox[toolAxis] = tool[toolAxis]; textBox[toolAxis] = tool[toolAxis];
if (directions[cornerAxis] < 0) { // Adjust the text box position reducing its size from the corner axis
const topLeft = cornerstone.pageToPixel(element, 0, 0); const isDirectionPositive = directions[cornerAxis] > 0;
const bottomRight = cornerstone.pageToPixel(element, bounds.x, bounds.y); if ((foundPlace && !isDirectionPositive) || (!foundPlace && isDirectionPositive)) {
const boxSize = bottomRight[cornerAxis] - topLeft[cornerAxis]; const boxSize = getTextBoxSizeInPixels(element, cornerAxis, bounds);
textBox[cornerAxis] -= boxSize; textBox[cornerAxis] -= boxSize;
} }
}; };