mirror/openseadragon
1
0
Fork 0
mirror of https://github.com/openseadragon/openseadragon.git synced 2024-11-25 06:36:11 +03:00
Code Issues Projects Releases Wiki Activity

fixed viewport constraint behavior when viewer is rotated

Browse Source
This commit is contained in:
Tom 2022-12-02 16:43:39 -05:00
parent 09544f795f
commit ac18d5629d
2 changed files with 34 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/viewer.js
View File

@ -3049,17 +3049,16 @@ function onCanvasDrag( event ) {
this.viewport.centerSpringX.target.value += delta.x; this.viewport.centerSpringX.target.value += delta.x;
this.viewport.centerSpringY.target.value += delta.y; this.viewport.centerSpringY.target.value += delta.y;
var bounds = this.viewport.getBounds();
var constrainedBounds = this.viewport.getConstrainedBounds(); var constrainedBounds = this.viewport.getConstrainedBounds();
this.viewport.centerSpringX.target.value -= delta.x; this.viewport.centerSpringX.target.value -= delta.x;
this.viewport.centerSpringY.target.value -= delta.y; this.viewport.centerSpringY.target.value -= delta.y;
if (bounds.x !== constrainedBounds.x) { if (constrainedBounds.xConstrained) {
event.delta.x = 0; event.delta.x = 0;
} }
if (bounds.y !== constrainedBounds.y) { if (constrainedBounds.yConstrained) {
event.delta.y = 0; event.delta.y = 0;
} }
} }

55
src/viewport.js
View File

@ -515,33 +515,36 @@ $.Viewport.prototype = {
* @returns {OpenSeadragon.Rect} constrained bounds. * @returns {OpenSeadragon.Rect} constrained bounds.
*/ */
_applyBoundaryConstraints: function(bounds) { _applyBoundaryConstraints: function(bounds) {
var newBounds = new $.Rect( var newBounds = this.viewportToViewerElementRectangle(bounds).getBoundingBox();
bounds.x, var cb = this.viewportToViewerElementRectangle(this._contentBoundsNoRotate).getBoundingBox();
bounds.y,
bounds.width, var xConstrained = false;
bounds.height); var yConstrained = false;
if (this.wrapHorizontal) { if (this.wrapHorizontal) {
//do nothing //do nothing
} else { } else {
var boundsRight = newBounds.x + newBounds.width; var boundsRight = newBounds.x + newBounds.width;
var contentRight = this._contentBoundsNoRotate.x + this._contentBoundsNoRotate.width; var contentRight = cb.x + cb.width;
var horizontalThreshold, leftDx, rightDx; var horizontalThreshold, leftDx, rightDx;
if (newBounds.width > this._contentBoundsNoRotate.width) { if (newBounds.width > cb.width) {
horizontalThreshold = this.visibilityRatio * this._contentBoundsNoRotate.width; horizontalThreshold = this.visibilityRatio * cb.width;
} else { } else {
horizontalThreshold = this.visibilityRatio * newBounds.width; horizontalThreshold = this.visibilityRatio * newBounds.width;
} }
leftDx = this._contentBoundsNoRotate.x - boundsRight + horizontalThreshold; leftDx = cb.x - boundsRight + horizontalThreshold;
rightDx = contentRight - newBounds.x - horizontalThreshold; rightDx = contentRight - newBounds.x - horizontalThreshold;
if (horizontalThreshold > this._contentBoundsNoRotate.width) { if (horizontalThreshold > cb.width) {
newBounds.x += (leftDx + rightDx) / 2; newBounds.x += (leftDx + rightDx) / 2;
xConstrained = true;
} else if (rightDx < 0) { } else if (rightDx < 0) {
newBounds.x += rightDx; newBounds.x += rightDx;
xConstrained = true;
} else if (leftDx > 0) { } else if (leftDx > 0) {
newBounds.x += leftDx; newBounds.x += leftDx;
xConstrained = true;
} }
} }
@ -550,28 +553,36 @@ $.Viewport.prototype = {
//do nothing //do nothing
} else { } else {
var boundsBottom = newBounds.y + newBounds.height; var boundsBottom = newBounds.y + newBounds.height;
var contentBottom = this._contentBoundsNoRotate.y + this._contentBoundsNoRotate.height; var contentBottom = cb.y + cb.height;
var verticalThreshold, topDy, bottomDy; var verticalThreshold, topDy, bottomDy;
if (newBounds.height > this._contentBoundsNoRotate.height) { if (newBounds.height > cb.height) {
verticalThreshold = this.visibilityRatio * this._contentBoundsNoRotate.height; verticalThreshold = this.visibilityRatio * cb.height;
} else{ } else{
verticalThreshold = this.visibilityRatio * newBounds.height; verticalThreshold = this.visibilityRatio * newBounds.height;
} }
topDy = this._contentBoundsNoRotate.y - boundsBottom + verticalThreshold; topDy = cb.y - boundsBottom + verticalThreshold;
bottomDy = contentBottom - newBounds.y - verticalThreshold; bottomDy = contentBottom - newBounds.y - verticalThreshold;
if (verticalThreshold > this._contentBoundsNoRotate.height) { if (verticalThreshold > cb.height) {
newBounds.y += (topDy + bottomDy) / 2; newBounds.y += (topDy + bottomDy) / 2;
yConstrained = true;
} else if (bottomDy < 0) { } else if (bottomDy < 0) {
newBounds.y += bottomDy; newBounds.y += bottomDy;
yConstrained = true;
} else if (topDy > 0) { } else if (topDy > 0) {
newBounds.y += topDy; newBounds.y += topDy;
yConstrained = true;
} }
} }
return newBounds; var newViewportBounds = this.viewerElementToViewportRectangle(newBounds);
newViewportBounds.xConstrained = xConstrained;
newViewportBounds.yConstrained = yConstrained;
newViewportBounds.constraintApplied = xConstrained || yConstrained;
return newViewportBounds;
}, },
/** /**
@ -615,17 +626,13 @@ $.Viewport.prototype = {
this.zoomTo(constrainedZoom, this.zoomPoint, immediately); this.zoomTo(constrainedZoom, this.zoomPoint, immediately);
} }
var bounds = this.getBoundsNoRotate(); var constrainedBounds = this.getConstrainedBounds(false);
var constrainedBounds = this._applyBoundaryConstraints(bounds);
this._raiseConstraintsEvent(immediately); this._raiseConstraintsEvent(immediately);
if (bounds.x !== constrainedBounds.x || if(constrainedBounds.constraintApplied){
bounds.y !== constrainedBounds.y || this.fitBounds(constrainedBounds, immediately);
immediately) {
this.fitBounds(
constrainedBounds.rotate(-this.getRotation(true)),
immediately);
} }
return this; return this;
}, },