From 2e4e187b2160313cb2ff7cff16a895714524f142 Mon Sep 17 00:00:00 2001 From: nein09 Date: Fri, 29 Aug 2014 11:53:29 -0700 Subject: [PATCH] Adding functionality for https://github.com/openseadragon/openseadragon/issues/127 - option for home button to fill rather than fit. - Added a option to pass to the OpenSeadragon constructor called homeFillsViewer, which defaults to false. If true, the home button will fill the viewer with the image, centered on the image's center, zoomed to fill the viewer at the image's smallest dimension, and clipped at the image's largest dimension. For example, a very tall, thin image in a 4:3 aspect ratio viewer will zoom so that the width of the image fills the viewer, and most of the height of the image is clipped. --- src/viewer.js | 6 ++++-- src/viewport.js | 22 ++++++++++++++-------- 2 files changed, 18 insertions(+), 10 deletions(-) diff --git a/src/viewer.js b/src/viewer.js index 5435b3a0..6011dbe3 100644 --- a/src/viewer.js +++ b/src/viewer.js @@ -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 }); } diff --git a/src/viewport.js b/src/viewport.js index e1231500..af917956 100644 --- a/src/viewport.js +++ b/src/viewport.js @@ -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; + } } }, @@ -167,7 +174,6 @@ $.Viewport.prototype = /** @lends OpenSeadragon.Viewport.prototype */{ var center = this.homeBounds.getCenter( ), width = 1.0 / this.getHomeZoom( ), height = width / this.getAspectRatio(); - return new $.Rect( center.x - ( width / 2.0 ), center.y - ( height / 2.0 ),