diff --git a/src/fullscreen.js b/src/fullscreen.js
index feeab0b5..2935923f 100644
--- a/src/fullscreen.js
+++ b/src/fullscreen.js
@@ -72,6 +72,7 @@
requestFullScreen: function() {},
cancelFullScreen: function() {},
fullScreenEventName: '',
+ fullScreenErrorEventName: '',
prefix: ''
},
browserPrefixes = 'webkit moz o ms khtml'.split(' ');
@@ -95,6 +96,7 @@
// update methods to do something useful
if (fullScreenApi.supportsFullScreen) {
fullScreenApi.fullScreenEventName = fullScreenApi.prefix + 'fullscreenchange';
+ fullScreenApi.fullScreenErrorEventName = fullScreenApi.prefix + 'fullscreenerror';
fullScreenApi.isFullScreen = function() {
switch (this.prefix) {
diff --git a/src/openseadragon.js b/src/openseadragon.js
index 3e7c7fd4..421ae73e 100644
--- a/src/openseadragon.js
+++ b/src/openseadragon.js
@@ -900,7 +900,7 @@ window.OpenSeadragon = window.OpenSeadragon || function( options ){
/**
- * Determines the pages current scroll position.
+ * Determines the page's current scroll position.
* @function
* @name OpenSeadragon.getPageScroll
* @returns {Point}
@@ -931,14 +931,64 @@ window.OpenSeadragon = window.OpenSeadragon || function( options ){
);
};
} else {
- $.getPageScroll = function(){
- return new $.Point(0,0);
- };
+ // We can't reassign the function yet, as there was no scroll.
+ return new $.Point(0,0);
}
return $.getPageScroll();
},
+ /**
+ * Set the page scroll position.
+ * @function
+ * @name OpenSeadragon.getPageScroll
+ * @returns {Point}
+ */
+ setPageScroll: function( scroll ) {
+ if ( typeof ( window.scrollTo ) !== "undefined" ) {
+ $.setPageScroll = function( scroll ) {
+ window.scrollTo( scroll.x, scroll.y );
+ };
+ } else {
+ var originalScroll = $.getPageScroll();
+ if ( originalScroll.x === scroll.x &&
+ originalScroll.y === scroll.y ) {
+ // We are already correctly positioned and there
+ // is no way to detect the correct method.
+ return;
+ }
+
+ document.body.scrollLeft = scroll.x;
+ document.body.scrollTop = scroll.y;
+ var currentScroll = $.getPageScroll();
+ if ( currentScroll.x !== originalScroll.x &&
+ currentScroll.y !== originalScroll.y ) {
+ $.setPageScroll = function( scroll ) {
+ document.body.scrollLeft = scroll.x;
+ document.body.scrollTop = scroll.y;
+ };
+ return;
+ }
+
+ document.documentElement.scrollLeft = scroll.x;
+ document.documentElement.scrollTop = scroll.y;
+ currentScroll = $.getPageScroll();
+ if ( currentScroll.x !== originalScroll.x &&
+ currentScroll.y !== originalScroll.y ) {
+ $.setPageScroll = function( scroll ) {
+ document.documentElement.scrollLeft = scroll.x;
+ document.documentElement.scrollTop = scroll.y;
+ };
+ return;
+ }
+
+ // We can't find anything working, so we do nothing.
+ $.setPageScroll = function( scroll ) {
+ };
+ }
+
+ return $.setPageScroll( scroll );
+ },
/**
* Determines the size of the browsers window.
diff --git a/src/viewer.js b/src/viewer.js
index 9133afbb..3de2671c 100644
--- a/src/viewer.js
+++ b/src/viewer.js
@@ -656,35 +656,52 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
*/
setFullPage: function( fullPage ) {
- var body = document.body,
- bodyStyle = body.style,
- docStyle = document.documentElement.style,
- canvasStyle = this.canvas.style,
- _this = this,
- oldBounds,
- newBounds,
- viewer,
+ var body = document.body,
+ bodyStyle = body.style,
+ docStyle = document.documentElement.style,
+ _this = this,
hash,
nodes,
i;
//dont bother modifying the DOM if we are already in full page mode.
if ( fullPage == this.isFullPage() ) {
- return;
+ return this;
}
+ var fullPageEventArgs = {
+ fullPage: fullPage,
+ preventDefaultAction: false
+ };
+ this.raiseEvent( 'pre-full-page', fullPageEventArgs );
+ if ( fullPageEventArgs.preventDefaultAction ) {
+ return this;
+ }
if ( fullPage ) {
- this.bodyOverflow = bodyStyle.overflow;
- this.docOverflow = docStyle.overflow;
- bodyStyle.overflow = "hidden";
- docStyle.overflow = "hidden";
+ this.elementSize = $.getElementSize( this.element );
+ this.pageScroll = $.getPageScroll();
- this.bodyWidth = bodyStyle.width;
- this.bodyHeight = bodyStyle.height;
- bodyStyle.width = "100%";
- bodyStyle.height = "100%";
+ this.elementMargin = this.element.style.margin;
+ this.element.style.margin = "0";
+ this.elementPadding = this.element.style.padding;
+ this.element.style.padding = "0";
+
+ this.bodyMargin = bodyStyle.margin;
+ this.docMargin = docStyle.margin;
+ bodyStyle.margin = "0";
+ docStyle.margin = "0";
+
+ this.bodyPadding = bodyStyle.padding;
+ this.docPadding = docStyle.padding;
+ bodyStyle.padding = "0";
+ docStyle.padding = "0";
+
+ this.bodyWidth = bodyStyle.width;
+ this.bodyHeight = bodyStyle.height;
+ bodyStyle.width = "100%";
+ bodyStyle.height = "100%";
//when entering full screen on the ipad it wasnt sufficient to leave
//the body intact as only only the top half of the screen would
@@ -697,14 +714,14 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
THIS[ this.hash ].prevElementWidth = this.element.style.width;
THIS[ this.hash ].prevElementHeight = this.element.style.height;
nodes = body.childNodes.length;
- for ( i = 0; i < nodes; i ++ ){
+ for ( i = 0; i < nodes; i++ ) {
this.previousBody.push( body.childNodes[ 0 ] );
body.removeChild( body.childNodes[ 0 ] );
}
//If we've got a toolbar, we need to enable the user to use css to
//preserve it in fullpage mode
- if( this.toolbar && this.toolbar.element ){
+ if ( this.toolbar && this.toolbar.element ) {
//save a reference to the parent so we can put it back
//in the long run we need a better strategy
this.toolbar.parentNode = this.toolbar.element.parentNode;
@@ -719,38 +736,10 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
$.addClass( this.element, 'fullpage' );
body.appendChild( this.element );
- if( $.supportsFullScreen ){
- THIS[ this.hash ].onfullscreenchange = function() {
- /*
- fullscreenchange events don't include the new fullscreen status so we need to
- retrieve the current status from the fullscreen API. See:
- https://developer.mozilla.org/en-US/docs/Web/Reference/Events/fullscreenchange
- */
+ this.element.style.height = $.getWindowSize().y + 'px';
+ this.element.style.width = $.getWindowSize().x + 'px';
- if( $.isFullScreen() ){
- _this.setFullPage( true );
- } else {
- _this.setFullPage( false );
- }
- };
-
- $.requestFullScreen( document.body );
-
- // The target of the event is always the document,
- // but it is possible to retrieve the fullscreen element through the API
- // Note that the API is still vendor-prefixed in browsers implementing it
- document.addEventListener(
- $.fullScreenEventName,
- THIS[ this.hash ].onfullscreenchange
- );
- this.element.style.height = '100%';
- this.element.style.width = '100%';
- }else{
- this.element.style.height = $.getWindowSize().y + 'px';
- this.element.style.width = $.getWindowSize().x + 'px';
- }
-
- if( this.toolbar && this.toolbar.element ){
+ if ( this.toolbar && this.toolbar.element ) {
this.element.style.height = (
$.getElementSize( this.element ).y - $.getElementSize( this.toolbar.element ).y
) + 'px';
@@ -761,29 +750,23 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
// mouse will be inside container now
$.delegate( this, onContainerEnter )( {} );
-
} else {
- if( $.supportsFullScreen ){
- document.removeEventListener(
- $.fullScreenEventName,
- THIS[ this.hash ].onfullscreenchange
- );
- $.cancelFullScreen( document );
- }
+ this.element.style.margin = this.elementMargin;
+ this.element.style.padding = this.elementPadding;
- bodyStyle.overflow = this.bodyOverflow;
- docStyle.overflow = this.docOverflow;
+ bodyStyle.margin = this.bodyMargin;
+ docStyle.margin = this.docMargin;
- bodyStyle.width = this.bodyWidth;
- bodyStyle.height = this.bodyHeight;
+ bodyStyle.padding = this.bodyPadding;
+ docStyle.padding = this.docPadding;
- canvasStyle.backgroundColor = "";
- canvasStyle.color = "";
+ bodyStyle.width = this.bodyWidth;
+ bodyStyle.height = this.bodyHeight;
body.removeChild( this.element );
nodes = this.previousBody.length;
- for ( i = 0; i < nodes; i++ ){
+ for ( i = 0; i < nodes; i++ ) {
body.appendChild( this.previousBody.shift() );
}
@@ -795,75 +778,117 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
//If we've got a toolbar, we need to enable the user to use css to
//reset it to its original state
- if( this.toolbar && this.toolbar.element ){
+ if ( this.toolbar && this.toolbar.element ) {
body.removeChild( this.toolbar.element );
//Make sure the user has some ability to style the toolbar based
//on the mode
$.removeClass( this.toolbar.element, 'fullpage' );
- //this.toolbar.element.style.position = 'relative';
+
this.toolbar.parentNode.insertBefore(
this.toolbar.element,
this.toolbar.nextSibling
);
delete this.toolbar.parentNode;
delete this.toolbar.nextSibling;
-
- //this.container.style.top = 'auto';
}
this.element.style.width = THIS[ this.hash ].prevElementWidth;
this.element.style.height = THIS[ this.hash ].prevElementHeight;
+ // After exiting fullPage or fullScreen, it can take some time
+ // before the browser can actually set the scroll.
+ var restoreScrollCounter = 0;
+ var restoreScroll = function() {
+ $.setPageScroll( _this.pageScroll );
+ var pageScroll = $.getPageScroll();
+ restoreScrollCounter++;
+ if ( restoreScrollCounter < 10 &&
+ pageScroll.x !== _this.pageScroll.x ||
+ pageScroll.y !== _this.pageScroll.y ) {
+ $.requestAnimationFrame( restoreScroll );
+ }
+ };
+ $.requestAnimationFrame( restoreScroll );
+
THIS[ this.hash ].fullPage = false;
// mouse will likely be outside now
- $.delegate( this, onContainerExit )( {} );
-
+ $.delegate( this, onContainerExit )( { } );
}
- this.raiseEvent( 'fullpage', { fullpage: fullPage } );
- if ( this.viewport ) {
- oldBounds = this.viewport.getBounds();
- this.viewport.resize( THIS[ this.hash ].prevContainerSize );
- newBounds = this.viewport.getBounds();
+ this.raiseEvent( 'full-page', { fullPage: fullPage } );
- if ( fullPage ) {
- THIS[ this.hash ].fsBoundsDelta = new $.Point(
- newBounds.width / oldBounds.width,
- newBounds.height / oldBounds.height
- );
- } else {
- this.viewport.update();
- this.viewport.zoomBy(
- Math.max(
- THIS[ this.hash ].fsBoundsDelta.x,
- THIS[ this.hash ].fsBoundsDelta.y
- ),
- null,
- true
- );
- //Ensures that if multiple viewers are on a page, the viewers that
- //were hidden during fullpage are 'reopened'
- for( hash in VIEWERS ){
- viewer = VIEWERS[ hash ];
- if( viewer !== this && viewer != this.navigator ){
- viewer.open( viewer.source );
- if( viewer.navigator ){
- viewer.navigator.open( viewer.source );
- }
- }
- }
- }
-
- THIS[ this.hash ].forceRedraw = true;
- updateOnce( this );
-
- }
return this;
},
+ /**
+ * Toggle full screen mode if supported. Toggle full page mode otherwise.
+ * @function
+ * @name OpenSeadragon.Viewer.prototype.setFullScreen
+ * @param {Boolean} fullScreen
+ * If true, enter full screen mode. If false, exit full screen mode.
+ * @return {OpenSeadragon.Viewer} Chainable.
+ */
+ setFullScreen: function( fullScreen ) {
+ var _this = this;
+
+ if ( !$.supportsFullScreen ) {
+ return this.setFullPage( fullScreen );
+ }
+
+ if ( $.isFullScreen() === fullScreen ) {
+ return this;
+ }
+
+ var fullScreeEventArgs = {
+ fullScreen: fullScreen,
+ preventDefaultAction: false
+ };
+ this.raiseEvent( 'pre-full-screen', fullScreeEventArgs );
+ if ( fullScreeEventArgs.preventDefaultAction ) {
+ return this;
+ }
+
+ if ( fullScreen ) {
+
+ this.setFullPage( true );
+ // If the full page mode is not actually entered, we need to prevent
+ // the full screen mode.
+ if ( !this.isFullPage() ) {
+ return this;
+ }
+
+ this.fullPageStyleWidth = this.element.style.width;
+ this.fullPageStyleHeight = this.element.style.height;
+ this.element.style.width = '100%';
+ this.element.style.height = '100%';
+
+ var onFullScreenChange = function() {
+ var isFullScreen = $.isFullScreen();
+ if ( !isFullScreen ) {
+ $.removeEvent( document, $.fullScreenEventName, onFullScreenChange );
+ $.removeEvent( document, $.fullScreenErrorEventName, onFullScreenChange );
+
+ _this.setFullPage( false );
+ if ( _this.isFullPage() ) {
+ _this.element.style.width = _this.fullPageStyleWidth;
+ _this.element.style.height = _this.fullPageStyleHeight;
+ }
+ }
+ _this.raiseEvent( 'full-screen', { fullScreen: isFullScreen } );
+ };
+ $.addEvent( document, $.fullScreenEventName, onFullScreenChange );
+ $.addEvent( document, $.fullScreenErrorEventName, onFullScreenChange );
+
+ $.requestFullScreen( document.body );
+
+ } else {
+ $.cancelFullScreen();
+ }
+ return this;
+ },
/**
* @function
@@ -988,7 +1013,7 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
beginZoomingOutHandler = $.delegate( this, beginZoomingOut ),
doSingleZoomOutHandler = $.delegate( this, doSingleZoomOut ),
onHomeHandler = $.delegate( this, onHome ),
- onFullPageHandler = $.delegate( this, onFullPage ),
+ onFullScreenHandler = $.delegate( this, onFullScreen ),
onFocusHandler = $.delegate( this, onFocus ),
onBlurHandler = $.delegate( this, onBlur ),
navImages = this.navImages,
@@ -1063,7 +1088,7 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
srcGroup: resolveUrl( this.prefixUrl, navImages.fullpage.GROUP ),
srcHover: resolveUrl( this.prefixUrl, navImages.fullpage.HOVER ),
srcDown: resolveUrl( this.prefixUrl, navImages.fullpage.DOWN ),
- onRelease: onFullPageHandler,
+ onRelease: onFullScreenHandler,
onFocus: onFocusHandler,
onBlur: onBlurHandler
}));
@@ -1633,8 +1658,11 @@ function updateOnce( viewer ) {
containerSize = _getSafeElemSize( viewer.container );
if ( !containerSize.equals( THIS[ viewer.hash ].prevContainerSize ) ) {
// maintain image position
- viewer.viewport.resize( containerSize, true );
+ var oldBounds = viewer.viewport.getBounds();
+ var oldCenter = viewer.viewport.getCenter();
+ resizeViewportAndRecenter(viewer, containerSize, oldBounds, oldCenter);
THIS[ viewer.hash ].prevContainerSize = containerSize;
+ THIS[ viewer.hash ].forceRedraw = true;
}
animated = viewer.viewport.update();
@@ -1675,7 +1703,30 @@ function updateOnce( viewer ) {
//viewer.profiler.endUpdate();
}
+// This function resizes the viewport and recenters the image
+// as it was before resizing.
+// TODO: better adjust width and height. The new width and height
+// should depend on the image dimensions and on the dimensions
+// of the viewport before and after switching mode.
+function resizeViewportAndRecenter( viewer, containerSize, oldBounds, oldCenter ) {
+ var viewport = viewer.viewport;
+ viewport.resize( containerSize, true );
+
+ // We try to remove blanks as much as possible
+ var imageHeight = 1 / viewer.source.aspectRatio;
+ var newWidth = oldBounds.width <= 1 ? oldBounds.width : 1;
+ var newHeight = oldBounds.height <= imageHeight ?
+ oldBounds.height : imageHeight;
+
+ var newBounds = new $.Rect(
+ oldCenter.x - ( newWidth / 2.0 ),
+ oldCenter.y - ( newHeight / 2.0 ),
+ newWidth,
+ newHeight
+ );
+ viewport.fitBounds( newBounds, true );
+}
///////////////////////////////////////////////////////////////////////////////
// Navigation Controls
@@ -1765,10 +1816,15 @@ function onHome() {
}
-function onFullPage() {
- this.setFullPage( !this.isFullPage() );
+function onFullScreen() {
+ if ( this.isFullPage() && !$.isFullScreen() ) {
+ // Is fullPage but not fullScreen
+ this.setFullPage( false );
+ } else {
+ this.setFullScreen( !this.isFullPage() );
+ }
// correct for no mouseout event on change
- if( this.buttons ){
+ if ( this.buttons ) {
this.buttons.emulateExit();
}
this.fullPageButton.element.focus();
diff --git a/test/basic.js b/test/basic.js
index 3ab694f1..946a8ff3 100644
--- a/test/basic.js
+++ b/test/basic.js
@@ -174,22 +174,80 @@
});
// ----------
- asyncTest('Fullscreen', function() {
+ asyncTest('FullPage', function() {
viewer.addHandler("open", function () {
ok(!viewer.isFullPage(), 'Started out not fullpage');
ok(!$(viewer.element).hasClass('fullpage'),
'No fullpage class on div');
- viewer.setFullPage(true);
- ok(viewer.isFullPage(), 'Enabled fullpage');
- ok($(viewer.element).hasClass('fullpage'),
- 'Fullpage class added to div');
+ var checkEnteringPreFullPage = function(event) {
+ viewer.removeHandler('pre-full-page', checkEnteringPreFullPage);
+ ok(event.fullPage, 'Switching to fullpage');
+ ok(!viewer.isFullPage(), 'Not yet fullpage');
+ };
- viewer.setFullPage(false);
- ok(!viewer.isFullPage(), 'Disabled fullpage');
- ok(!$(viewer.element).hasClass('fullpage'),
- 'Fullpage class removed from div');
+ var checkEnteringFullPage = function(event) {
+ viewer.removeHandler('full-page', checkEnteringFullPage);
+ ok(event.fullPage, 'Switched to fullpage');
+ ok(viewer.isFullPage(), 'Enabled fullpage');
+ ok($(viewer.element).hasClass('fullpage'),
+ 'Fullpage class added to div');
+
+ var checkExitingPreFullPage = function(event) {
+ viewer.removeHandler('pre-full-page', checkExitingPreFullPage);
+ ok(!event.fullPage, 'Exiting fullpage');
+ ok(viewer.isFullPage(), 'Still fullpage');
+ };
+
+ var checkExitingFullPage = function(event) {
+ viewer.removeHandler('full-page', checkExitingFullPage);
+ ok(!event.fullPage, 'Exiting fullpage');
+ ok(!viewer.isFullPage(), 'Disabled fullpage');
+ ok(!$(viewer.element).hasClass('fullpage'),
+ 'Fullpage class removed from div');
+ start();
+ };
+
+ viewer.addHandler("pre-full-page", checkExitingPreFullPage);
+ viewer.addHandler("full-page", checkExitingFullPage);
+ viewer.setFullPage(false);
+ };
+ viewer.addHandler("pre-full-page", checkEnteringPreFullPage);
+ viewer.addHandler("full-page", checkEnteringFullPage);
+ viewer.setFullPage(true);
+ });
+
+ viewer.open('/test/data/testpattern.dzi');
+ });
+
+ asyncTest('FullScreen', function() {
+
+ if (!OpenSeadragon.supportsFullScreen) {
+ expect(0);
start();
+ return;
+ }
+
+ viewer.addHandler("open", function () {
+ ok(!OpenSeadragon.isFullScreen(), 'Started out not fullscreen');
+
+ var checkEnteringPreFullScreen = function(event) {
+ viewer.removeHandler('pre-full-screen', checkEnteringPreFullScreen);
+ ok(event.fullScreen, 'Switching to fullscreen');
+ ok(!OpenSeadragon.isFullScreen(), 'Not yet fullscreen');
+ };
+
+ // The fullscreen mode is always denied during tests so we are
+ // exiting directly.
+ var checkExitingFullScreen = function(event) {
+ viewer.removeHandler('full-screen', checkExitingFullScreen);
+ ok(!event.fullScreen, 'Exiting fullscreen');
+ ok(!OpenSeadragon.isFullScreen(), 'Disabled fullscreen');
+ start();
+ };
+ viewer.addHandler("pre-full-screen", checkEnteringPreFullScreen);
+ viewer.addHandler("full-screen", checkExitingFullScreen);
+ viewer.setFullScreen(true);
});
viewer.open('/test/data/testpattern.dzi');
diff --git a/test/polyfills.js b/test/polyfills.js
new file mode 100644
index 00000000..5e93b1b8
--- /dev/null
+++ b/test/polyfills.js
@@ -0,0 +1,128 @@
+/* global module, asyncTest, $, ok, equal, notEqual, start, test, Util, testLog */
+
+( function() {
+
+ module( 'Polyfills', {
+ setup: function() {
+ testLog.reset();
+ }
+ } );
+
+ // ----------
+ test( 'pageScroll', function() {
+ // Setup
+ var origWidth = $( "body" ).width(),
+ origHeight = $( "body" ).height();
+ $( "body" ).width( origWidth + 10000 );
+ $( "body" ).height( origHeight + 10000 );
+ $( document ).scrollLeft( 0 );
+ $( document ).scrollTop( 0 );
+ // End setup
+
+ // Test get
+ var originalGetPageScroll = OpenSeadragon.getPageScroll;
+
+ var scroll = OpenSeadragon.getPageScroll();
+ equal( scroll.x, 0, "Scroll should be 0 at beginning." );
+ equal( scroll.y, 0, "Scroll should be 0 at beginning." );
+
+ // If window.pageXOffset is not supported, the getPageScroll method should
+ // not have been redefined
+ if ( typeof ( window.pageXOffset ) != "number" ) {
+ equal( originalGetPageScroll, OpenSeadragon.getPageScroll,
+ "OpenSeadragon.getPageScroll must not be redefined when on 0,0" +
+ " and window API is not supported." );
+ } else {
+ notEqual( originalGetPageScroll, OpenSeadragon.getPageScroll,
+ "OpenSeadragon.getPageScroll must be redefined when window API " +
+ "is supported." );
+ }
+
+ $( document ).scrollLeft( 200 );
+ $( document ).scrollTop( 100 );
+ scroll = originalGetPageScroll();
+ equal( scroll.x, 200, "First call to getScroll." );
+ equal( scroll.y, 100, "First call to getScroll." );
+
+ $( document ).scrollLeft( 500 );
+ $( document ).scrollTop( 600 );
+ scroll = OpenSeadragon.getPageScroll();
+ equal( scroll.x, 500, "Second call to getScroll." );
+ equal( scroll.y, 600, "Second call to getScroll." );
+
+
+
+ // Test set, must be imperatively be done after tests for get to not
+ // break them.
+ var originalSetPageScroll = OpenSeadragon.setPageScroll;
+
+ $( document ).scrollLeft( 0 );
+ $( document ).scrollTop( 0 );
+ var scroll = new OpenSeadragon.Point( 0, 0 );
+ OpenSeadragon.setPageScroll( scroll );
+ equal( $( document ).scrollLeft(), 0, "First call to 0,0 while already on 0,0." );
+ equal( $( document ).scrollTop(), 0, "First call to 0,0 while already on 0,0." );
+
+ // If window.pageXOffset is not supported, the getPageScroll method should
+ // not have been redefined
+ if ( typeof ( window.scrollTo ) === "undefined" ) {
+ equal( originalSetPageScroll, OpenSeadragon.setPageScroll,
+ "OpenSeadragon.setPageScroll must not be redefined when not moving." );
+ } else {
+ notEqual( originalSetPageScroll, OpenSeadragon.setPageScroll,
+ "OpenSeadragon.setPageScroll must be redefined when window API is supported." );
+ }
+
+
+ OpenSeadragon.setPageScroll = originalSetPageScroll;
+ $( document ).scrollLeft( 100 );
+ $( document ).scrollTop( 200 );
+ var scroll = new OpenSeadragon.Point( 100, 200 );
+ OpenSeadragon.setPageScroll( scroll );
+ equal( $( document ).scrollLeft(), 100, "First call to 100,200 while already on 100,200." );
+ equal( $( document ).scrollTop(), 200, "First call to 100,200 while already on 100,200." );
+
+ // If window.pageXOffset is not supported, the getPageScroll method should
+ // not have been redefined
+ if ( typeof ( window.scrollTo ) === "undefined" ) {
+ equal( originalSetPageScroll, OpenSeadragon.setPageScroll,
+ "OpenSeadragon.setPageScroll must not be redefined when not moving." );
+ } else {
+ notEqual( originalSetPageScroll, OpenSeadragon.setPageScroll,
+ "OpenSeadragon.setPageScroll must be redefined when window API is supported." );
+ }
+
+
+ OpenSeadragon.setPageScroll = originalSetPageScroll;
+ $( document ).scrollLeft( 20000 );
+ $( document ).scrollTop( 20000 );
+ var actualScrollLeft = $( document ).scrollLeft();
+ var actualScrollTop = $( document ).scrollTop();
+ $( document ).scrollLeft( 0 );
+ $( document ).scrollTop( 0 );
+ var scroll = new OpenSeadragon.Point( 20000, 20000 );
+ OpenSeadragon.setPageScroll( scroll );
+ equal( $( document ).scrollLeft(), actualScrollLeft, "First call to position above limits." );
+ equal( $( document ).scrollTop(), actualScrollTop, "First call to position above limits." );
+ notEqual( originalSetPageScroll, OpenSeadragon.setPageScroll,
+ "Even if outside scroll limits, OpenSeadragon.setPageScroll can be " +
+ "reassigned on first call." );
+
+
+ var currentSetPageScroll = OpenSeadragon.setPageScroll;
+ var scroll = new OpenSeadragon.Point( 200, 200 );
+ OpenSeadragon.setPageScroll( scroll );
+ equal( $( document ).scrollLeft(), 200, "Second call." );
+ equal( $( document ).scrollTop(), 200, "Second call." );
+ equal( currentSetPageScroll, OpenSeadragon.setPageScroll,
+ "OpenSeadragon.setPageScroll must not be reassigned after first call." );
+
+
+ // Teardown
+ $( "body" ).width( origWidth );
+ $( "body" ).height( origHeight );
+ $( document ).scrollLeft( 0 );
+ $( document ).scrollTop( 0 );
+ } );
+
+} )();
diff --git a/test/test.html b/test/test.html
index 3bd6f919..0f46fa30 100644
--- a/test/test.html
+++ b/test/test.html
@@ -16,6 +16,10 @@
+
+
+