mirror of
https://github.com/openseadragon/openseadragon.git
synced 2025-02-16 23:03:13 +03:00
finished cleaning up Viewport methods
This commit is contained in:
parent
21753e6800
commit
8f67eb6f14
@ -4003,8 +4003,10 @@ function finishLoadingImage( image, callback, successful, jobid ){
|
|||||||
(function( $ ){
|
(function( $ ){
|
||||||
|
|
||||||
$.Viewport = function(containerSize, contentSize, config) {
|
$.Viewport = function(containerSize, contentSize, config) {
|
||||||
this.zoomPoint = null;
|
//TODO: this.config is something that should go away but currently the
|
||||||
|
// Drawer references the viewport.config
|
||||||
this.config = config;
|
this.config = config;
|
||||||
|
this.zoomPoint = null;
|
||||||
this.containerSize = containerSize;
|
this.containerSize = containerSize;
|
||||||
this.contentSize = contentSize;
|
this.contentSize = contentSize;
|
||||||
this.contentAspect = contentSize.x / contentSize.y;
|
this.contentAspect = contentSize.x / contentSize.y;
|
||||||
@ -4029,8 +4031,8 @@ $.Viewport = function(containerSize, contentSize, config) {
|
|||||||
this.visibilityRatio = config.visibilityRatio;
|
this.visibilityRatio = config.visibilityRatio;
|
||||||
this.wrapHorizontal = config.wrapHorizontal;
|
this.wrapHorizontal = config.wrapHorizontal;
|
||||||
this.wrapVertical = config.wrapVertical;
|
this.wrapVertical = config.wrapVertical;
|
||||||
this.homeBounds = new $.Rect(0, 0, 1, this.contentHeight);
|
this.homeBounds = new $.Rect( 0, 0, 1, this.contentHeight );
|
||||||
this.goHome(true);
|
this.goHome( true );
|
||||||
this.update();
|
this.update();
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -4061,7 +4063,7 @@ $.Viewport.prototype = {
|
|||||||
return new $.Point(this.containerSize.x, this.containerSize.y);
|
return new $.Point(this.containerSize.x, this.containerSize.y);
|
||||||
},
|
},
|
||||||
|
|
||||||
getBounds: function(current) {
|
getBounds: function( current ) {
|
||||||
var center = this.getCenter(current),
|
var center = this.getCenter(current),
|
||||||
width = 1.0 / this.getZoom(current),
|
width = 1.0 / this.getZoom(current),
|
||||||
height = width / this.getAspectRatio();
|
height = width / this.getAspectRatio();
|
||||||
@ -4074,7 +4076,7 @@ $.Viewport.prototype = {
|
|||||||
);
|
);
|
||||||
},
|
},
|
||||||
|
|
||||||
getCenter: function(current) {
|
getCenter: function( current ) {
|
||||||
var centerCurrent = new $.Point(
|
var centerCurrent = new $.Point(
|
||||||
this.centerSpringX.current.value,
|
this.centerSpringX.current.value,
|
||||||
this.centerSpringY.current.value
|
this.centerSpringY.current.value
|
||||||
@ -4121,8 +4123,8 @@ $.Viewport.prototype = {
|
|||||||
return centerTarget.plus( deltaZoomPoints );
|
return centerTarget.plus( deltaZoomPoints );
|
||||||
},
|
},
|
||||||
|
|
||||||
getZoom: function(current) {
|
getZoom: function( current ) {
|
||||||
if (current) {
|
if ( current ) {
|
||||||
return this.zoomSpring.current.value;
|
return this.zoomSpring.current.value;
|
||||||
} else {
|
} else {
|
||||||
return this.zoomSpring.target.value;
|
return this.zoomSpring.target.value;
|
||||||
@ -4130,52 +4132,64 @@ $.Viewport.prototype = {
|
|||||||
},
|
},
|
||||||
|
|
||||||
|
|
||||||
applyConstraints: function(immediately) {
|
applyConstraints: function( immediately ) {
|
||||||
var actualZoom = this.getZoom();
|
var actualZoom = this.getZoom(),
|
||||||
var constrainedZoom = Math.max(Math.min(actualZoom, this.getMaxZoom()), this.getMinZoom());
|
constrainedZoom = Math.max(
|
||||||
if (actualZoom != constrainedZoom) {
|
Math.min( actualZoom, this.getMaxZoom() ),
|
||||||
this.zoomTo(constrainedZoom, this.zoomPoint, immediately);
|
this.getMinZoom()
|
||||||
|
),
|
||||||
|
bounds,
|
||||||
|
horizontalThreshold,
|
||||||
|
verticalThreshold,
|
||||||
|
left,
|
||||||
|
right,
|
||||||
|
top,
|
||||||
|
bottom,
|
||||||
|
dx = 0,
|
||||||
|
dy = 0;
|
||||||
|
|
||||||
|
if ( actualZoom != constrainedZoom ) {
|
||||||
|
this.zoomTo( constrainedZoom, this.zoomPoint, immediately );
|
||||||
}
|
}
|
||||||
|
|
||||||
var bounds = this.getBounds();
|
bounds = this.getBounds();
|
||||||
var visibilityRatio = this.visibilityRatio;
|
|
||||||
|
|
||||||
var horThres = visibilityRatio * bounds.width;
|
horizontalThreshold = this.visibilityRatio * bounds.width;
|
||||||
var verThres = visibilityRatio * bounds.height;
|
verticalThreshold = this.visibilityRatio * bounds.height;
|
||||||
|
|
||||||
var left = bounds.x + bounds.width;
|
left = bounds.x + bounds.width;
|
||||||
var right = 1 - bounds.x;
|
right = 1 - bounds.x;
|
||||||
var top = bounds.y + bounds.height;
|
top = bounds.y + bounds.height;
|
||||||
var bottom = this.contentHeight - bounds.y;
|
bottom = this.contentHeight - bounds.y;
|
||||||
|
|
||||||
var dx = 0;
|
|
||||||
if ( this.wrapHorizontal ) {
|
if ( this.wrapHorizontal ) {
|
||||||
} else if (left < horThres) {
|
//do nothing
|
||||||
dx = horThres - left;
|
} else if ( left < horizontalThreshold ) {
|
||||||
} else if (right < horThres) {
|
dx = horizontalThreshold - left;
|
||||||
dx = right - horThres;
|
} else if ( right < horizontalThreshold ) {
|
||||||
|
dx = right - horizontalThreshold;
|
||||||
}
|
}
|
||||||
|
|
||||||
var dy = 0;
|
|
||||||
if ( this.wrapVertical ) {
|
if ( this.wrapVertical ) {
|
||||||
} else if (top < verThres) {
|
//do nothing
|
||||||
dy = verThres - top;
|
} else if ( top < verticalThreshold ) {
|
||||||
} else if (bottom < verThres) {
|
dy = verticalThreshold - top;
|
||||||
dy = bottom - verThres;
|
} else if ( bottom < verticalThreshold ) {
|
||||||
|
dy = bottom - verticalThreshold;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (dx || dy) {
|
if ( dx || dy ) {
|
||||||
bounds.x += dx;
|
bounds.x += dx;
|
||||||
bounds.y += dy;
|
bounds.y += dy;
|
||||||
this.fitBounds(bounds, immediately);
|
this.fitBounds( bounds, immediately );
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
ensureVisible: function(immediately) {
|
ensureVisible: function( immediately ) {
|
||||||
this.applyConstraints(immediately);
|
this.applyConstraints( immediately );
|
||||||
},
|
},
|
||||||
|
|
||||||
fitBounds: function(bounds, immediately) {
|
fitBounds: function( bounds, immediately ) {
|
||||||
var aspect = this.getAspectRatio(),
|
var aspect = this.getAspectRatio(),
|
||||||
center = bounds.getCenter(),
|
center = bounds.getCenter(),
|
||||||
newBounds = new $.Rect(
|
newBounds = new $.Rect(
|
||||||
@ -4187,14 +4201,14 @@ $.Viewport.prototype = {
|
|||||||
oldBounds,
|
oldBounds,
|
||||||
oldZoom,
|
oldZoom,
|
||||||
newZoom,
|
newZoom,
|
||||||
refPoint;
|
referencePoint;
|
||||||
|
|
||||||
if (newBounds.getAspectRatio() >= aspect) {
|
if (newBounds.getAspectRatio() >= aspect) {
|
||||||
newBounds.height = bounds.width / aspect;
|
newBounds.height = bounds.width / aspect;
|
||||||
newBounds.y = center.y - newBounds.height / 2;
|
newBounds.y = center.y - newBounds.height / 2;
|
||||||
} else {
|
} else {
|
||||||
newBounds.width = bounds.height * aspect;
|
newBounds.width = bounds.height * aspect;
|
||||||
newBounds.x = center.x - newBounds.width / 2;
|
newBounds.x = center.x - newBounds.width / 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
this.panTo(this.getCenter(true), true);
|
this.panTo(this.getCenter(true), true);
|
||||||
@ -4208,7 +4222,7 @@ $.Viewport.prototype = {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
refPoint = oldBounds.getTopLeft().times(
|
referencePoint = oldBounds.getTopLeft().times(
|
||||||
this.containerSize.x / oldBounds.width
|
this.containerSize.x / oldBounds.width
|
||||||
).minus(
|
).minus(
|
||||||
newBounds.getTopLeft().times(
|
newBounds.getTopLeft().times(
|
||||||
@ -4220,7 +4234,7 @@ $.Viewport.prototype = {
|
|||||||
);
|
);
|
||||||
|
|
||||||
|
|
||||||
this.zoomTo( newZoom, refPoint, immediately );
|
this.zoomTo( newZoom, referencePoint, immediately );
|
||||||
},
|
},
|
||||||
|
|
||||||
goHome: function(immediately) {
|
goHome: function(immediately) {
|
||||||
|
@ -2,8 +2,10 @@
|
|||||||
(function( $ ){
|
(function( $ ){
|
||||||
|
|
||||||
$.Viewport = function(containerSize, contentSize, config) {
|
$.Viewport = function(containerSize, contentSize, config) {
|
||||||
this.zoomPoint = null;
|
//TODO: this.config is something that should go away but currently the
|
||||||
|
// Drawer references the viewport.config
|
||||||
this.config = config;
|
this.config = config;
|
||||||
|
this.zoomPoint = null;
|
||||||
this.containerSize = containerSize;
|
this.containerSize = containerSize;
|
||||||
this.contentSize = contentSize;
|
this.contentSize = contentSize;
|
||||||
this.contentAspect = contentSize.x / contentSize.y;
|
this.contentAspect = contentSize.x / contentSize.y;
|
||||||
@ -28,8 +30,8 @@ $.Viewport = function(containerSize, contentSize, config) {
|
|||||||
this.visibilityRatio = config.visibilityRatio;
|
this.visibilityRatio = config.visibilityRatio;
|
||||||
this.wrapHorizontal = config.wrapHorizontal;
|
this.wrapHorizontal = config.wrapHorizontal;
|
||||||
this.wrapVertical = config.wrapVertical;
|
this.wrapVertical = config.wrapVertical;
|
||||||
this.homeBounds = new $.Rect(0, 0, 1, this.contentHeight);
|
this.homeBounds = new $.Rect( 0, 0, 1, this.contentHeight );
|
||||||
this.goHome(true);
|
this.goHome( true );
|
||||||
this.update();
|
this.update();
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -60,7 +62,7 @@ $.Viewport.prototype = {
|
|||||||
return new $.Point(this.containerSize.x, this.containerSize.y);
|
return new $.Point(this.containerSize.x, this.containerSize.y);
|
||||||
},
|
},
|
||||||
|
|
||||||
getBounds: function(current) {
|
getBounds: function( current ) {
|
||||||
var center = this.getCenter(current),
|
var center = this.getCenter(current),
|
||||||
width = 1.0 / this.getZoom(current),
|
width = 1.0 / this.getZoom(current),
|
||||||
height = width / this.getAspectRatio();
|
height = width / this.getAspectRatio();
|
||||||
@ -73,7 +75,7 @@ $.Viewport.prototype = {
|
|||||||
);
|
);
|
||||||
},
|
},
|
||||||
|
|
||||||
getCenter: function(current) {
|
getCenter: function( current ) {
|
||||||
var centerCurrent = new $.Point(
|
var centerCurrent = new $.Point(
|
||||||
this.centerSpringX.current.value,
|
this.centerSpringX.current.value,
|
||||||
this.centerSpringY.current.value
|
this.centerSpringY.current.value
|
||||||
@ -120,8 +122,8 @@ $.Viewport.prototype = {
|
|||||||
return centerTarget.plus( deltaZoomPoints );
|
return centerTarget.plus( deltaZoomPoints );
|
||||||
},
|
},
|
||||||
|
|
||||||
getZoom: function(current) {
|
getZoom: function( current ) {
|
||||||
if (current) {
|
if ( current ) {
|
||||||
return this.zoomSpring.current.value;
|
return this.zoomSpring.current.value;
|
||||||
} else {
|
} else {
|
||||||
return this.zoomSpring.target.value;
|
return this.zoomSpring.target.value;
|
||||||
@ -129,52 +131,64 @@ $.Viewport.prototype = {
|
|||||||
},
|
},
|
||||||
|
|
||||||
|
|
||||||
applyConstraints: function(immediately) {
|
applyConstraints: function( immediately ) {
|
||||||
var actualZoom = this.getZoom();
|
var actualZoom = this.getZoom(),
|
||||||
var constrainedZoom = Math.max(Math.min(actualZoom, this.getMaxZoom()), this.getMinZoom());
|
constrainedZoom = Math.max(
|
||||||
if (actualZoom != constrainedZoom) {
|
Math.min( actualZoom, this.getMaxZoom() ),
|
||||||
this.zoomTo(constrainedZoom, this.zoomPoint, immediately);
|
this.getMinZoom()
|
||||||
|
),
|
||||||
|
bounds,
|
||||||
|
horizontalThreshold,
|
||||||
|
verticalThreshold,
|
||||||
|
left,
|
||||||
|
right,
|
||||||
|
top,
|
||||||
|
bottom,
|
||||||
|
dx = 0,
|
||||||
|
dy = 0;
|
||||||
|
|
||||||
|
if ( actualZoom != constrainedZoom ) {
|
||||||
|
this.zoomTo( constrainedZoom, this.zoomPoint, immediately );
|
||||||
}
|
}
|
||||||
|
|
||||||
var bounds = this.getBounds();
|
bounds = this.getBounds();
|
||||||
var visibilityRatio = this.visibilityRatio;
|
|
||||||
|
|
||||||
var horThres = visibilityRatio * bounds.width;
|
horizontalThreshold = this.visibilityRatio * bounds.width;
|
||||||
var verThres = visibilityRatio * bounds.height;
|
verticalThreshold = this.visibilityRatio * bounds.height;
|
||||||
|
|
||||||
var left = bounds.x + bounds.width;
|
left = bounds.x + bounds.width;
|
||||||
var right = 1 - bounds.x;
|
right = 1 - bounds.x;
|
||||||
var top = bounds.y + bounds.height;
|
top = bounds.y + bounds.height;
|
||||||
var bottom = this.contentHeight - bounds.y;
|
bottom = this.contentHeight - bounds.y;
|
||||||
|
|
||||||
var dx = 0;
|
|
||||||
if ( this.wrapHorizontal ) {
|
if ( this.wrapHorizontal ) {
|
||||||
} else if (left < horThres) {
|
//do nothing
|
||||||
dx = horThres - left;
|
} else if ( left < horizontalThreshold ) {
|
||||||
} else if (right < horThres) {
|
dx = horizontalThreshold - left;
|
||||||
dx = right - horThres;
|
} else if ( right < horizontalThreshold ) {
|
||||||
|
dx = right - horizontalThreshold;
|
||||||
}
|
}
|
||||||
|
|
||||||
var dy = 0;
|
|
||||||
if ( this.wrapVertical ) {
|
if ( this.wrapVertical ) {
|
||||||
} else if (top < verThres) {
|
//do nothing
|
||||||
dy = verThres - top;
|
} else if ( top < verticalThreshold ) {
|
||||||
} else if (bottom < verThres) {
|
dy = verticalThreshold - top;
|
||||||
dy = bottom - verThres;
|
} else if ( bottom < verticalThreshold ) {
|
||||||
|
dy = bottom - verticalThreshold;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (dx || dy) {
|
if ( dx || dy ) {
|
||||||
bounds.x += dx;
|
bounds.x += dx;
|
||||||
bounds.y += dy;
|
bounds.y += dy;
|
||||||
this.fitBounds(bounds, immediately);
|
this.fitBounds( bounds, immediately );
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
ensureVisible: function(immediately) {
|
ensureVisible: function( immediately ) {
|
||||||
this.applyConstraints(immediately);
|
this.applyConstraints( immediately );
|
||||||
},
|
},
|
||||||
|
|
||||||
fitBounds: function(bounds, immediately) {
|
fitBounds: function( bounds, immediately ) {
|
||||||
var aspect = this.getAspectRatio(),
|
var aspect = this.getAspectRatio(),
|
||||||
center = bounds.getCenter(),
|
center = bounds.getCenter(),
|
||||||
newBounds = new $.Rect(
|
newBounds = new $.Rect(
|
||||||
@ -186,14 +200,14 @@ $.Viewport.prototype = {
|
|||||||
oldBounds,
|
oldBounds,
|
||||||
oldZoom,
|
oldZoom,
|
||||||
newZoom,
|
newZoom,
|
||||||
refPoint;
|
referencePoint;
|
||||||
|
|
||||||
if (newBounds.getAspectRatio() >= aspect) {
|
if (newBounds.getAspectRatio() >= aspect) {
|
||||||
newBounds.height = bounds.width / aspect;
|
newBounds.height = bounds.width / aspect;
|
||||||
newBounds.y = center.y - newBounds.height / 2;
|
newBounds.y = center.y - newBounds.height / 2;
|
||||||
} else {
|
} else {
|
||||||
newBounds.width = bounds.height * aspect;
|
newBounds.width = bounds.height * aspect;
|
||||||
newBounds.x = center.x - newBounds.width / 2;
|
newBounds.x = center.x - newBounds.width / 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
this.panTo(this.getCenter(true), true);
|
this.panTo(this.getCenter(true), true);
|
||||||
@ -207,7 +221,7 @@ $.Viewport.prototype = {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
refPoint = oldBounds.getTopLeft().times(
|
referencePoint = oldBounds.getTopLeft().times(
|
||||||
this.containerSize.x / oldBounds.width
|
this.containerSize.x / oldBounds.width
|
||||||
).minus(
|
).minus(
|
||||||
newBounds.getTopLeft().times(
|
newBounds.getTopLeft().times(
|
||||||
@ -219,7 +233,7 @@ $.Viewport.prototype = {
|
|||||||
);
|
);
|
||||||
|
|
||||||
|
|
||||||
this.zoomTo( newZoom, refPoint, immediately );
|
this.zoomTo( newZoom, referencePoint, immediately );
|
||||||
},
|
},
|
||||||
|
|
||||||
goHome: function(immediately) {
|
goHome: function(immediately) {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user