Merge pull request #474 from nein09/issue-127

Add option for home button to fill viewer (issue 127)
This commit is contained in:
iangilman 2014-09-15 13:24:55 -07:00
commit 356b7e1f5f
3 changed files with 49 additions and 35 deletions

View File

@ -221,6 +221,10 @@
*
* @property {Number} [maxZoomLevel=null]
*
* @property {Boolean} [homeFillsViewer=false]
* Make the 'home' button fill the viewer and clip the image, instead
* of fitting the image to the viewer and letterboxing.
*
* @property {Boolean} [panHorizontal=true]
* Allow horizontal pan.
*
@ -912,6 +916,7 @@ window.OpenSeadragon = window.OpenSeadragon || function( options ){
defaultZoomLevel: 0,
minZoomLevel: null,
maxZoomLevel: null,
homeFillsViewer: false,
//UI RESPONSIVENESS AND FEEL
clickTimeThreshold: 300,

View File

@ -1937,7 +1937,8 @@ function openTileSource( viewer, source ) {
degrees: _this.degrees //,
//TODO: figure out how to support these in a way that makes sense
//minZoomLevel: this.minZoomLevel,
//maxZoomLevel: this.maxZoomLevel
//maxZoomLevel: this.maxZoomLevel,
//homeFillsViewer: this.homeFillsViewer
});
} else {
if( source ){
@ -1958,7 +1959,8 @@ function openTileSource( viewer, source ) {
maxZoomLevel: _this.maxZoomLevel,
viewer: _this,
degrees: _this.degrees,
navigatorRotate: _this.navigatorRotate
navigatorRotate: _this.navigatorRotate,
homeFillsViewer: _this.homeFillsViewer
});
}

View File

@ -84,7 +84,8 @@ $.Viewport = function( options ) {
defaultZoomLevel: $.DEFAULT_SETTINGS.defaultZoomLevel,
minZoomLevel: $.DEFAULT_SETTINGS.minZoomLevel,
maxZoomLevel: $.DEFAULT_SETTINGS.maxZoomLevel,
degrees: $.DEFAULT_SETTINGS.degrees
degrees: $.DEFAULT_SETTINGS.degrees,
homeFillsViewer: $.DEFAULT_SETTINGS.homeFillsViewer
}, options );
@ -148,15 +149,21 @@ $.Viewport.prototype = /** @lends OpenSeadragon.Viewport.prototype */{
* @function
*/
getHomeZoom: function() {
var aspectFactor =
this.contentAspectX / this.getAspectRatio();
if( this.defaultZoomLevel ){
return this.defaultZoomLevel;
} else {
return ( aspectFactor >= 1 ) ?
1 :
aspectFactor;
var aspectFactor =
this.contentAspectX / this.getAspectRatio();
if( this.homeFillsViewer ){ // fill the viewer and clip the image
return ( aspectFactor >= 1) ?
aspectFactor :
1;
} else {
return ( aspectFactor >= 1 ) ?
1 :
aspectFactor;
}
}
},
@ -319,7 +326,7 @@ $.Viewport.prototype = /** @lends OpenSeadragon.Viewport.prototype */{
return this.zoomSpring.target.value;
}
},
/**
* @function
* @private
@ -342,7 +349,7 @@ $.Viewport.prototype = /** @lends OpenSeadragon.Viewport.prototype */{
bounds.width,
bounds.height
);
horizontalThreshold = this.visibilityRatio * newBounds.width;
verticalThreshold = this.visibilityRatio * newBounds.height;
@ -387,7 +394,7 @@ $.Viewport.prototype = /** @lends OpenSeadragon.Viewport.prototype */{
newBounds.y = this.contentAspectY/2 - newBounds.height/2;
}
}
if( this.viewer ){
/**
* Raised when the viewport constraints are applied (see {@link OpenSeadragon.Viewport#applyConstraints}).
@ -403,10 +410,10 @@ $.Viewport.prototype = /** @lends OpenSeadragon.Viewport.prototype */{
immediately: immediately
});
}
return newBounds;
},
/**
* @function
* @return {OpenSeadragon.Viewport} Chainable.
@ -420,7 +427,7 @@ $.Viewport.prototype = /** @lends OpenSeadragon.Viewport.prototype */{
),
bounds,
constrainedBounds;
if ( actualZoom != constrainedZoom ) {
this.zoomTo( constrainedZoom, this.zoomPoint, immediately );
}
@ -428,11 +435,11 @@ $.Viewport.prototype = /** @lends OpenSeadragon.Viewport.prototype */{
bounds = this.getBounds();
constrainedBounds = this._applyBoundaryConstraints( bounds, immediately );
if ( bounds.x !== constrainedBounds.x || bounds.y !== constrainedBounds.y || immediately ){
this.fitBounds( constrainedBounds, immediately );
}
return this;
},
@ -443,7 +450,7 @@ $.Viewport.prototype = /** @lends OpenSeadragon.Viewport.prototype */{
ensureVisible: function( immediately ) {
return this.applyConstraints( immediately );
},
/**
* @function
* @private
@ -455,7 +462,7 @@ $.Viewport.prototype = /** @lends OpenSeadragon.Viewport.prototype */{
options = options || {};
var immediately = options.immediately || false;
var constraints = options.constraints || false;
var aspect = this.getAspectRatio(),
center = bounds.getCenter(),
newBounds = new $.Rect(
@ -470,7 +477,7 @@ $.Viewport.prototype = /** @lends OpenSeadragon.Viewport.prototype */{
referencePoint,
newBoundsAspectRatio,
newConstrainedZoom;
if ( newBounds.getAspectRatio() >= aspect ) {
newBounds.height = bounds.width / aspect;
newBounds.y = center.y - newBounds.height / 2;
@ -478,24 +485,24 @@ $.Viewport.prototype = /** @lends OpenSeadragon.Viewport.prototype */{
newBounds.width = bounds.height * aspect;
newBounds.x = center.x - newBounds.width / 2;
}
if ( constraints ) {
newBoundsAspectRatio = newBounds.getAspectRatio();
}
this.panTo( this.getCenter( true ), true );
this.zoomTo( this.getZoom( true ), null, true );
oldBounds = this.getBounds();
oldZoom = this.getZoom();
newZoom = 1.0 / newBounds.width;
if ( constraints ) {
newConstrainedZoom = Math.max(
Math.min(newZoom, this.getMaxZoom() ),
this.getMinZoom()
);
if (newZoom !== newConstrainedZoom) {
newZoom = newConstrainedZoom;
newBounds.width = 1.0 / newZoom;
@ -503,14 +510,14 @@ $.Viewport.prototype = /** @lends OpenSeadragon.Viewport.prototype */{
newBounds.height = newBounds.width / newBoundsAspectRatio;
newBounds.y = center.y - newBounds.height / 2;
}
newBounds = this._applyBoundaryConstraints( newBounds, immediately );
}
if ( newZoom == oldZoom || newBounds.width == oldBounds.width ) {
return this.panTo( constraints ? newBounds.getCenter() : center, immediately );
}
referencePoint = oldBounds.getTopLeft().times(
this.containerSize.x / oldBounds.width
).minus(
@ -521,10 +528,10 @@ $.Viewport.prototype = /** @lends OpenSeadragon.Viewport.prototype */{
this.containerSize.x / oldBounds.width -
this.containerSize.x / newBounds.width
);
return this.zoomTo( newZoom, referencePoint, immediately );
},
/**
* @function
* @param {OpenSeadragon.Rect} bounds
@ -537,7 +544,7 @@ $.Viewport.prototype = /** @lends OpenSeadragon.Viewport.prototype */{
constraints: false
} );
},
/**
* @function
* @param {OpenSeadragon.Rect} bounds
@ -550,7 +557,7 @@ $.Viewport.prototype = /** @lends OpenSeadragon.Viewport.prototype */{
constraints: true
} );
},
/**
* @function
* @param {Boolean} immediately
@ -725,7 +732,7 @@ $.Viewport.prototype = /** @lends OpenSeadragon.Viewport.prototype */{
degrees = ( degrees + 360 ) % 360;
this.degrees = degrees;
this.viewer.forceRedraw();
/**
* Raised when rotation has been changed.
*
@ -1077,7 +1084,7 @@ $.Viewport.prototype = /** @lends OpenSeadragon.Viewport.prototype */{
return viewerCoordinates.plus(
OpenSeadragon.getElementPosition( this.viewer.element ));
},
/**
* Convert a viewport zoom to an image zoom.
* Image zoom: ratio of the original image size to displayed image size.
@ -1095,7 +1102,7 @@ $.Viewport.prototype = /** @lends OpenSeadragon.Viewport.prototype */{
var viewportToImageZoomRatio = containerWidth / imageWidth;
return viewportZoom * viewportToImageZoomRatio;
},
/**
* Convert an image zoom to a viewport zoom.
* Image zoom: ratio of the original image size to displayed image size.