mirror of
https://github.com/openseadragon/openseadragon.git
synced 2024-11-29 00:26:10 +03:00
removed NavControl abstraction since it is only applied in Viewer. Made all psuedo-private _methods closure private functions which still use $.delegate ( $.delegate is a pattern I still dislike and eventually hope to remove if possible ).
This commit is contained in:
thatcher
parent
b061a4d830
commit
44a997b03b
296
openseadragon.js
296
openseadragon.js
@ -1222,147 +1222,10 @@ $.Utils = new $.Utils();
|
|||||||
(function( $ ){
|
(function( $ ){
|
||||||
|
|
||||||
$.NavControl = function( viewer ) {
|
$.NavControl = function( viewer ) {
|
||||||
this._group = null;
|
|
||||||
this._zooming = false; // whether we should be continuously zooming
|
|
||||||
this._zoomFactor = null; // how much we should be continuously zooming by
|
|
||||||
this._lastZoomTime = null;
|
|
||||||
this._viewer = viewer;
|
|
||||||
this.config = this._viewer.config;
|
|
||||||
|
|
||||||
this.elmt = null;
|
|
||||||
|
|
||||||
var beginZoomingInHandler = $.delegate(this, this._beginZoomingIn);
|
|
||||||
var endZoomingHandler = $.delegate(this, this._endZooming);
|
|
||||||
var doSingleZoomInHandler = $.delegate(this, this._doSingleZoomIn);
|
|
||||||
var beginZoomingOutHandler = $.delegate(this, this._beginZoomingOut);
|
|
||||||
var doSingleZoomOutHandler = $.delegate(this, this._doSingleZoomOut);
|
|
||||||
var onHomeHandler = $.delegate(this, this._onHome);
|
|
||||||
var onFullPageHandler = $.delegate(this, this._onFullPage);
|
|
||||||
|
|
||||||
var navImages = this._viewer.config.navImages;
|
|
||||||
|
|
||||||
var zoomIn = new $.Button({
|
|
||||||
config: this._viewer.config,
|
|
||||||
tooltip: $.Strings.getString("Tooltips.ZoomIn"),
|
|
||||||
srcRest: this._resolveUrl(navImages.zoomIn.REST),
|
|
||||||
srcGroup: this._resolveUrl(navImages.zoomIn.GROUP),
|
|
||||||
srcHover: this._resolveUrl(navImages.zoomIn.HOVER),
|
|
||||||
srcDown: this._resolveUrl(navImages.zoomIn.DOWN),
|
|
||||||
onPress: beginZoomingInHandler,
|
|
||||||
onRelease: endZoomingHandler,
|
|
||||||
onClick: doSingleZoomInHandler,
|
|
||||||
onEnter: beginZoomingInHandler,
|
|
||||||
onExit: endZoomingHandler
|
|
||||||
});
|
|
||||||
var zoomOut = new $.Button({
|
|
||||||
config: this._viewer.config,
|
|
||||||
tooltip: $.Strings.getString("Tooltips.ZoomOut"),
|
|
||||||
srcRest: this._resolveUrl(navImages.zoomOut.REST),
|
|
||||||
srcGroup: this._resolveUrl(navImages.zoomOut.GROUP),
|
|
||||||
srcHover: this._resolveUrl(navImages.zoomOut.HOVER),
|
|
||||||
srcDown: this._resolveUrl(navImages.zoomOut.DOWN),
|
|
||||||
onPress: beginZoomingOutHandler,
|
|
||||||
onRelease: endZoomingHandler,
|
|
||||||
onClick: doSingleZoomOutHandler,
|
|
||||||
onEnter: beginZoomingOutHandler,
|
|
||||||
onExit: endZoomingHandler
|
|
||||||
});
|
|
||||||
var goHome = new $.Button({
|
|
||||||
config: this._viewer.config,
|
|
||||||
tooltip: $.Strings.getString("Tooltips.Home"),
|
|
||||||
srcRest: this._resolveUrl(navImages.home.REST),
|
|
||||||
srcGroup: this._resolveUrl(navImages.home.GROUP),
|
|
||||||
srcHover: this._resolveUrl(navImages.home.HOVER),
|
|
||||||
srcDown: this._resolveUrl(navImages.home.DOWN),
|
|
||||||
onRelease: onHomeHandler
|
|
||||||
});
|
|
||||||
var fullPage = new $.Button({
|
|
||||||
config: this._viewer.config,
|
|
||||||
tooltip: $.Strings.getString("Tooltips.FullPage"),
|
|
||||||
srcRest: this._resolveUrl(navImages.fullpage.REST),
|
|
||||||
srcGroup: this._resolveUrl(navImages.fullpage.GROUP),
|
|
||||||
srcHover: this._resolveUrl(navImages.fullpage.HOVER),
|
|
||||||
srcDown: this._resolveUrl(navImages.fullpage.DOWN),
|
|
||||||
onRelease: onFullPageHandler
|
|
||||||
});
|
|
||||||
this._group = new $.ButtonGroup({
|
|
||||||
config: this._viewer.config,
|
|
||||||
buttons: [zoomIn, zoomOut, goHome, fullPage]
|
|
||||||
});
|
|
||||||
|
|
||||||
this.elmt = this._group.element;
|
|
||||||
this.elmt[ $.SIGNAL ] = true; // hack to get our controls to fade
|
|
||||||
this._viewer.addHandler('open', $.delegate(this, this._lightUp));
|
|
||||||
};
|
};
|
||||||
|
|
||||||
$.NavControl.prototype = {
|
$.NavControl.prototype = {
|
||||||
|
|
||||||
_resolveUrl: function(url) {
|
|
||||||
var prefix = this._viewer.prefixUrl;
|
|
||||||
return prefix ? prefix + url : url;
|
|
||||||
},
|
|
||||||
_beginZoomingIn: function() {
|
|
||||||
this._lastZoomTime = new Date().getTime();
|
|
||||||
this._zoomFactor = this.config.zoomPerSecond;
|
|
||||||
this._zooming = true;
|
|
||||||
this._scheduleZoom();
|
|
||||||
},
|
|
||||||
_beginZoomingOut: function() {
|
|
||||||
this._lastZoomTime = new Date().getTime();
|
|
||||||
this._zoomFactor = 1.0 / this.config.zoomPerSecond;
|
|
||||||
this._zooming = true;
|
|
||||||
this._scheduleZoom();
|
|
||||||
},
|
|
||||||
|
|
||||||
_endZooming: function() {
|
|
||||||
this._zooming = false;
|
|
||||||
},
|
|
||||||
_scheduleZoom: function() {
|
|
||||||
window.setTimeout($.delegate(this, this._doZoom), 10);
|
|
||||||
},
|
|
||||||
_doZoom: function() {
|
|
||||||
if (this._zooming && this._viewer.viewport) {
|
|
||||||
var currentTime = new Date().getTime();
|
|
||||||
var deltaTime = currentTime - this._lastZoomTime;
|
|
||||||
var adjustedFactor = Math.pow(this._zoomFactor, deltaTime / 1000);
|
|
||||||
|
|
||||||
this._viewer.viewport.zoomBy(adjustedFactor);
|
|
||||||
this._viewer.viewport.applyConstraints();
|
|
||||||
this._lastZoomTime = currentTime;
|
|
||||||
this._scheduleZoom();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
_doSingleZoomIn: function() {
|
|
||||||
if (this._viewer.viewport) {
|
|
||||||
this._zooming = false;
|
|
||||||
this._viewer.viewport.zoomBy(this.config.zoomPerClick / 1.0);
|
|
||||||
this._viewer.viewport.applyConstraints();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
_doSingleZoomOut: function() {
|
|
||||||
if (this._viewer.viewport) {
|
|
||||||
this._zooming = false;
|
|
||||||
this._viewer.viewport.zoomBy(1.0 / this.config.zoomPerClick);
|
|
||||||
this._viewer.viewport.applyConstraints();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
_lightUp: function() {
|
|
||||||
this._group.emulateEnter();
|
|
||||||
this._group.emulateExit();
|
|
||||||
},
|
|
||||||
_onHome: function() {
|
|
||||||
if (this._viewer.viewport) {
|
|
||||||
this._viewer.viewport.goHome();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
_onFullPage: function() {
|
|
||||||
this._viewer.setFullPage(!this._viewer.isFullPage());
|
|
||||||
this._group.emulateExit(); // correct for no mouseout event on change
|
|
||||||
|
|
||||||
if (this._viewer.viewport) {
|
|
||||||
this._viewer.viewport.applyConstraints();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
};
|
||||||
|
|
||||||
}( OpenSeadragon ));
|
}( OpenSeadragon ));
|
||||||
@ -1617,9 +1480,82 @@ $.Viewer = function( options ) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
this.navControl = null;
|
//////////////////////////////////////////////////////////////////////////
|
||||||
|
// Navigation Controls
|
||||||
|
//////////////////////////////////////////////////////////////////////////
|
||||||
|
this._group = null;
|
||||||
|
this._zooming = false; // whether we should be continuously zooming
|
||||||
|
this._zoomFactor = null; // how much we should be continuously zooming by
|
||||||
|
this._lastZoomTime = null;
|
||||||
|
|
||||||
|
this.elmt = null;
|
||||||
|
|
||||||
|
var beginZoomingInHandler = $.delegate(this, beginZoomingIn);
|
||||||
|
var endZoomingHandler = $.delegate(this, endZooming);
|
||||||
|
var doSingleZoomInHandler = $.delegate(this, doSingleZoomIn);
|
||||||
|
var beginZoomingOutHandler = $.delegate(this, beginZoomingOut);
|
||||||
|
var doSingleZoomOutHandler = $.delegate(this, doSingleZoomOut);
|
||||||
|
var onHomeHandler = $.delegate(this, onHome);
|
||||||
|
var onFullPageHandler = $.delegate(this, onFullPage);
|
||||||
|
|
||||||
|
var navImages = this.config.navImages;
|
||||||
|
|
||||||
|
var zoomIn = new $.Button({
|
||||||
|
config: this.config,
|
||||||
|
tooltip: $.Strings.getString("Tooltips.ZoomIn"),
|
||||||
|
srcRest: resolveUrl(this.urlPrefix, navImages.zoomIn.REST),
|
||||||
|
srcGroup: resolveUrl(this.urlPrefix, navImages.zoomIn.GROUP),
|
||||||
|
srcHover: resolveUrl(this.urlPrefix, navImages.zoomIn.HOVER),
|
||||||
|
srcDown: resolveUrl(this.urlPrefix, navImages.zoomIn.DOWN),
|
||||||
|
onPress: beginZoomingInHandler,
|
||||||
|
onRelease: endZoomingHandler,
|
||||||
|
onClick: doSingleZoomInHandler,
|
||||||
|
onEnter: beginZoomingInHandler,
|
||||||
|
onExit: endZoomingHandler
|
||||||
|
});
|
||||||
|
|
||||||
|
var zoomOut = new $.Button({
|
||||||
|
config: this.config,
|
||||||
|
tooltip: $.Strings.getString("Tooltips.ZoomOut"),
|
||||||
|
srcRest: resolveUrl(this.urlPrefix, navImages.zoomOut.REST),
|
||||||
|
srcGroup: resolveUrl(this.urlPrefix, navImages.zoomOut.GROUP),
|
||||||
|
srcHover: resolveUrl(this.urlPrefix, navImages.zoomOut.HOVER),
|
||||||
|
srcDown: resolveUrl(this.urlPrefix, navImages.zoomOut.DOWN),
|
||||||
|
onPress: beginZoomingOutHandler,
|
||||||
|
onRelease: endZoomingHandler,
|
||||||
|
onClick: doSingleZoomOutHandler,
|
||||||
|
onEnter: beginZoomingOutHandler,
|
||||||
|
onExit: endZoomingHandler
|
||||||
|
});
|
||||||
|
var goHome = new $.Button({
|
||||||
|
config: this.config,
|
||||||
|
tooltip: $.Strings.getString("Tooltips.Home"),
|
||||||
|
srcRest: resolveUrl(this.urlPrefix, navImages.home.REST),
|
||||||
|
srcGroup: resolveUrl(this.urlPrefix, navImages.home.GROUP),
|
||||||
|
srcHover: resolveUrl(this.urlPrefix, navImages.home.HOVER),
|
||||||
|
srcDown: resolveUrl(this.urlPrefix, navImages.home.DOWN),
|
||||||
|
onRelease: onHomeHandler
|
||||||
|
});
|
||||||
|
var fullPage = new $.Button({
|
||||||
|
config: this.config,
|
||||||
|
tooltip: $.Strings.getString("Tooltips.FullPage"),
|
||||||
|
srcRest: resolveUrl(this.urlPrefix, navImages.fullpage.REST),
|
||||||
|
srcGroup: resolveUrl(this.urlPrefix, navImages.fullpage.GROUP),
|
||||||
|
srcHover: resolveUrl(this.urlPrefix, navImages.fullpage.HOVER),
|
||||||
|
srcDown: resolveUrl(this.urlPrefix, navImages.fullpage.DOWN),
|
||||||
|
onRelease: onFullPageHandler
|
||||||
|
});
|
||||||
|
|
||||||
|
this._group = new $.ButtonGroup({
|
||||||
|
config: this.config,
|
||||||
|
buttons: [ zoomIn, zoomOut, goHome, fullPage ]
|
||||||
|
});
|
||||||
|
|
||||||
|
this.navControl = this._group.element;
|
||||||
|
this.navControl[ $.SIGNAL ] = true; // hack to get our controls to fade
|
||||||
|
this.addHandler( 'open', $.delegate( this, lightUp ) );
|
||||||
|
|
||||||
if ( this.config.showNavigationControl ) {
|
if ( this.config.showNavigationControl ) {
|
||||||
this.navControl = (new $.NavControl(this)).elmt;
|
|
||||||
this.navControl.style.marginRight = "4px";
|
this.navControl.style.marginRight = "4px";
|
||||||
this.navControl.style.marginBottom = "4px";
|
this.navControl.style.marginBottom = "4px";
|
||||||
this.addControl(this.navControl, $.ControlAnchor.BOTTOM_RIGHT);
|
this.addControl(this.navControl, $.ControlAnchor.BOTTOM_RIGHT);
|
||||||
@ -2141,7 +2077,89 @@ function getControlIndex( viewer, elmt ) {
|
|||||||
///////////////////////////////////////////////////////////////////////////////
|
///////////////////////////////////////////////////////////////////////////////
|
||||||
|
|
||||||
|
|
||||||
|
///////////////////////////////////////////////////////////////////////////////
|
||||||
|
// Navigation Controls
|
||||||
|
///////////////////////////////////////////////////////////////////////////////
|
||||||
|
|
||||||
|
function resolveUrl( prefix, url ) {
|
||||||
|
return prefix ? prefix + url : url;
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
function beginZoomingIn() {
|
||||||
|
this._lastZoomTime = +new Date();
|
||||||
|
this._zoomFactor = this.config.zoomPerSecond;
|
||||||
|
this._zooming = true;
|
||||||
|
scheduleZoom( this );
|
||||||
|
}
|
||||||
|
|
||||||
|
function beginZoomingOut() {
|
||||||
|
this._lastZoomTime = +new Date();
|
||||||
|
this._zoomFactor = 1.0 / this.config.zoomPerSecond;
|
||||||
|
this._zooming = true;
|
||||||
|
scheduleZoom( this );
|
||||||
|
}
|
||||||
|
|
||||||
|
function endZooming() {
|
||||||
|
this._zooming = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
function scheduleZoom( viewer ) {
|
||||||
|
window.setTimeout($.delegate(viewer, doZoom), 10);
|
||||||
|
}
|
||||||
|
|
||||||
|
function doZoom() {
|
||||||
|
if (this._zooming && this.viewport) {
|
||||||
|
var currentTime = +new Date();
|
||||||
|
var deltaTime = currentTime - this._lastZoomTime;
|
||||||
|
var adjustedFactor = Math.pow(this._zoomFactor, deltaTime / 1000);
|
||||||
|
|
||||||
|
this.viewport.zoomBy(adjustedFactor);
|
||||||
|
this.viewport.applyConstraints();
|
||||||
|
this._lastZoomTime = currentTime;
|
||||||
|
scheduleZoom( this );
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
function doSingleZoomIn() {
|
||||||
|
if (this.viewport) {
|
||||||
|
this._zooming = false;
|
||||||
|
this.viewport.zoomBy(
|
||||||
|
this.config.zoomPerClick / 1.0
|
||||||
|
);
|
||||||
|
this.viewport.applyConstraints();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
function doSingleZoomOut() {
|
||||||
|
if (this.viewport) {
|
||||||
|
this._zooming = false;
|
||||||
|
this.viewport.zoomBy(
|
||||||
|
1.0 / this.config.zoomPerClick
|
||||||
|
);
|
||||||
|
this.viewport.applyConstraints();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
function lightUp() {
|
||||||
|
this._group.emulateEnter();
|
||||||
|
this._group.emulateExit();
|
||||||
|
};
|
||||||
|
|
||||||
|
function onHome() {
|
||||||
|
if (this.viewport) {
|
||||||
|
this.viewport.goHome();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
function onFullPage() {
|
||||||
|
this.setFullPage( !this.isFullPage() );
|
||||||
|
this._group.emulateExit(); // correct for no mouseout event on change
|
||||||
|
|
||||||
|
if (this.viewport) {
|
||||||
|
this.viewport.applyConstraints();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
}( OpenSeadragon ));
|
}( OpenSeadragon ));
|
||||||
|
|
||||||
|
|||||||
@ -2,147 +2,10 @@
|
|||||||
(function( $ ){
|
(function( $ ){
|
||||||
|
|
||||||
$.NavControl = function( viewer ) {
|
$.NavControl = function( viewer ) {
|
||||||
this._group = null;
|
|
||||||
this._zooming = false; // whether we should be continuously zooming
|
|
||||||
this._zoomFactor = null; // how much we should be continuously zooming by
|
|
||||||
this._lastZoomTime = null;
|
|
||||||
this._viewer = viewer;
|
|
||||||
this.config = this._viewer.config;
|
|
||||||
|
|
||||||
this.elmt = null;
|
|
||||||
|
|
||||||
var beginZoomingInHandler = $.delegate(this, this._beginZoomingIn);
|
|
||||||
var endZoomingHandler = $.delegate(this, this._endZooming);
|
|
||||||
var doSingleZoomInHandler = $.delegate(this, this._doSingleZoomIn);
|
|
||||||
var beginZoomingOutHandler = $.delegate(this, this._beginZoomingOut);
|
|
||||||
var doSingleZoomOutHandler = $.delegate(this, this._doSingleZoomOut);
|
|
||||||
var onHomeHandler = $.delegate(this, this._onHome);
|
|
||||||
var onFullPageHandler = $.delegate(this, this._onFullPage);
|
|
||||||
|
|
||||||
var navImages = this._viewer.config.navImages;
|
|
||||||
|
|
||||||
var zoomIn = new $.Button({
|
|
||||||
config: this._viewer.config,
|
|
||||||
tooltip: $.Strings.getString("Tooltips.ZoomIn"),
|
|
||||||
srcRest: this._resolveUrl(navImages.zoomIn.REST),
|
|
||||||
srcGroup: this._resolveUrl(navImages.zoomIn.GROUP),
|
|
||||||
srcHover: this._resolveUrl(navImages.zoomIn.HOVER),
|
|
||||||
srcDown: this._resolveUrl(navImages.zoomIn.DOWN),
|
|
||||||
onPress: beginZoomingInHandler,
|
|
||||||
onRelease: endZoomingHandler,
|
|
||||||
onClick: doSingleZoomInHandler,
|
|
||||||
onEnter: beginZoomingInHandler,
|
|
||||||
onExit: endZoomingHandler
|
|
||||||
});
|
|
||||||
var zoomOut = new $.Button({
|
|
||||||
config: this._viewer.config,
|
|
||||||
tooltip: $.Strings.getString("Tooltips.ZoomOut"),
|
|
||||||
srcRest: this._resolveUrl(navImages.zoomOut.REST),
|
|
||||||
srcGroup: this._resolveUrl(navImages.zoomOut.GROUP),
|
|
||||||
srcHover: this._resolveUrl(navImages.zoomOut.HOVER),
|
|
||||||
srcDown: this._resolveUrl(navImages.zoomOut.DOWN),
|
|
||||||
onPress: beginZoomingOutHandler,
|
|
||||||
onRelease: endZoomingHandler,
|
|
||||||
onClick: doSingleZoomOutHandler,
|
|
||||||
onEnter: beginZoomingOutHandler,
|
|
||||||
onExit: endZoomingHandler
|
|
||||||
});
|
|
||||||
var goHome = new $.Button({
|
|
||||||
config: this._viewer.config,
|
|
||||||
tooltip: $.Strings.getString("Tooltips.Home"),
|
|
||||||
srcRest: this._resolveUrl(navImages.home.REST),
|
|
||||||
srcGroup: this._resolveUrl(navImages.home.GROUP),
|
|
||||||
srcHover: this._resolveUrl(navImages.home.HOVER),
|
|
||||||
srcDown: this._resolveUrl(navImages.home.DOWN),
|
|
||||||
onRelease: onHomeHandler
|
|
||||||
});
|
|
||||||
var fullPage = new $.Button({
|
|
||||||
config: this._viewer.config,
|
|
||||||
tooltip: $.Strings.getString("Tooltips.FullPage"),
|
|
||||||
srcRest: this._resolveUrl(navImages.fullpage.REST),
|
|
||||||
srcGroup: this._resolveUrl(navImages.fullpage.GROUP),
|
|
||||||
srcHover: this._resolveUrl(navImages.fullpage.HOVER),
|
|
||||||
srcDown: this._resolveUrl(navImages.fullpage.DOWN),
|
|
||||||
onRelease: onFullPageHandler
|
|
||||||
});
|
|
||||||
this._group = new $.ButtonGroup({
|
|
||||||
config: this._viewer.config,
|
|
||||||
buttons: [zoomIn, zoomOut, goHome, fullPage]
|
|
||||||
});
|
|
||||||
|
|
||||||
this.elmt = this._group.element;
|
|
||||||
this.elmt[ $.SIGNAL ] = true; // hack to get our controls to fade
|
|
||||||
this._viewer.addHandler('open', $.delegate(this, this._lightUp));
|
|
||||||
};
|
};
|
||||||
|
|
||||||
$.NavControl.prototype = {
|
$.NavControl.prototype = {
|
||||||
|
|
||||||
_resolveUrl: function(url) {
|
|
||||||
var prefix = this._viewer.prefixUrl;
|
|
||||||
return prefix ? prefix + url : url;
|
|
||||||
},
|
|
||||||
_beginZoomingIn: function() {
|
|
||||||
this._lastZoomTime = new Date().getTime();
|
|
||||||
this._zoomFactor = this.config.zoomPerSecond;
|
|
||||||
this._zooming = true;
|
|
||||||
this._scheduleZoom();
|
|
||||||
},
|
|
||||||
_beginZoomingOut: function() {
|
|
||||||
this._lastZoomTime = new Date().getTime();
|
|
||||||
this._zoomFactor = 1.0 / this.config.zoomPerSecond;
|
|
||||||
this._zooming = true;
|
|
||||||
this._scheduleZoom();
|
|
||||||
},
|
|
||||||
|
|
||||||
_endZooming: function() {
|
|
||||||
this._zooming = false;
|
|
||||||
},
|
|
||||||
_scheduleZoom: function() {
|
|
||||||
window.setTimeout($.delegate(this, this._doZoom), 10);
|
|
||||||
},
|
|
||||||
_doZoom: function() {
|
|
||||||
if (this._zooming && this._viewer.viewport) {
|
|
||||||
var currentTime = new Date().getTime();
|
|
||||||
var deltaTime = currentTime - this._lastZoomTime;
|
|
||||||
var adjustedFactor = Math.pow(this._zoomFactor, deltaTime / 1000);
|
|
||||||
|
|
||||||
this._viewer.viewport.zoomBy(adjustedFactor);
|
|
||||||
this._viewer.viewport.applyConstraints();
|
|
||||||
this._lastZoomTime = currentTime;
|
|
||||||
this._scheduleZoom();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
_doSingleZoomIn: function() {
|
|
||||||
if (this._viewer.viewport) {
|
|
||||||
this._zooming = false;
|
|
||||||
this._viewer.viewport.zoomBy(this.config.zoomPerClick / 1.0);
|
|
||||||
this._viewer.viewport.applyConstraints();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
_doSingleZoomOut: function() {
|
|
||||||
if (this._viewer.viewport) {
|
|
||||||
this._zooming = false;
|
|
||||||
this._viewer.viewport.zoomBy(1.0 / this.config.zoomPerClick);
|
|
||||||
this._viewer.viewport.applyConstraints();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
_lightUp: function() {
|
|
||||||
this._group.emulateEnter();
|
|
||||||
this._group.emulateExit();
|
|
||||||
},
|
|
||||||
_onHome: function() {
|
|
||||||
if (this._viewer.viewport) {
|
|
||||||
this._viewer.viewport.goHome();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
_onFullPage: function() {
|
|
||||||
this._viewer.setFullPage(!this._viewer.isFullPage());
|
|
||||||
this._group.emulateExit(); // correct for no mouseout event on change
|
|
||||||
|
|
||||||
if (this._viewer.viewport) {
|
|
||||||
this._viewer.viewport.applyConstraints();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
};
|
||||||
|
|
||||||
}( OpenSeadragon ));
|
}( OpenSeadragon ));
|
||||||
|
|||||||
159
src/viewer.js
159
src/viewer.js
@ -195,9 +195,82 @@ $.Viewer = function( options ) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
this.navControl = null;
|
//////////////////////////////////////////////////////////////////////////
|
||||||
|
// Navigation Controls
|
||||||
|
//////////////////////////////////////////////////////////////////////////
|
||||||
|
this._group = null;
|
||||||
|
this._zooming = false; // whether we should be continuously zooming
|
||||||
|
this._zoomFactor = null; // how much we should be continuously zooming by
|
||||||
|
this._lastZoomTime = null;
|
||||||
|
|
||||||
|
this.elmt = null;
|
||||||
|
|
||||||
|
var beginZoomingInHandler = $.delegate(this, beginZoomingIn);
|
||||||
|
var endZoomingHandler = $.delegate(this, endZooming);
|
||||||
|
var doSingleZoomInHandler = $.delegate(this, doSingleZoomIn);
|
||||||
|
var beginZoomingOutHandler = $.delegate(this, beginZoomingOut);
|
||||||
|
var doSingleZoomOutHandler = $.delegate(this, doSingleZoomOut);
|
||||||
|
var onHomeHandler = $.delegate(this, onHome);
|
||||||
|
var onFullPageHandler = $.delegate(this, onFullPage);
|
||||||
|
|
||||||
|
var navImages = this.config.navImages;
|
||||||
|
|
||||||
|
var zoomIn = new $.Button({
|
||||||
|
config: this.config,
|
||||||
|
tooltip: $.Strings.getString("Tooltips.ZoomIn"),
|
||||||
|
srcRest: resolveUrl(this.urlPrefix, navImages.zoomIn.REST),
|
||||||
|
srcGroup: resolveUrl(this.urlPrefix, navImages.zoomIn.GROUP),
|
||||||
|
srcHover: resolveUrl(this.urlPrefix, navImages.zoomIn.HOVER),
|
||||||
|
srcDown: resolveUrl(this.urlPrefix, navImages.zoomIn.DOWN),
|
||||||
|
onPress: beginZoomingInHandler,
|
||||||
|
onRelease: endZoomingHandler,
|
||||||
|
onClick: doSingleZoomInHandler,
|
||||||
|
onEnter: beginZoomingInHandler,
|
||||||
|
onExit: endZoomingHandler
|
||||||
|
});
|
||||||
|
|
||||||
|
var zoomOut = new $.Button({
|
||||||
|
config: this.config,
|
||||||
|
tooltip: $.Strings.getString("Tooltips.ZoomOut"),
|
||||||
|
srcRest: resolveUrl(this.urlPrefix, navImages.zoomOut.REST),
|
||||||
|
srcGroup: resolveUrl(this.urlPrefix, navImages.zoomOut.GROUP),
|
||||||
|
srcHover: resolveUrl(this.urlPrefix, navImages.zoomOut.HOVER),
|
||||||
|
srcDown: resolveUrl(this.urlPrefix, navImages.zoomOut.DOWN),
|
||||||
|
onPress: beginZoomingOutHandler,
|
||||||
|
onRelease: endZoomingHandler,
|
||||||
|
onClick: doSingleZoomOutHandler,
|
||||||
|
onEnter: beginZoomingOutHandler,
|
||||||
|
onExit: endZoomingHandler
|
||||||
|
});
|
||||||
|
var goHome = new $.Button({
|
||||||
|
config: this.config,
|
||||||
|
tooltip: $.Strings.getString("Tooltips.Home"),
|
||||||
|
srcRest: resolveUrl(this.urlPrefix, navImages.home.REST),
|
||||||
|
srcGroup: resolveUrl(this.urlPrefix, navImages.home.GROUP),
|
||||||
|
srcHover: resolveUrl(this.urlPrefix, navImages.home.HOVER),
|
||||||
|
srcDown: resolveUrl(this.urlPrefix, navImages.home.DOWN),
|
||||||
|
onRelease: onHomeHandler
|
||||||
|
});
|
||||||
|
var fullPage = new $.Button({
|
||||||
|
config: this.config,
|
||||||
|
tooltip: $.Strings.getString("Tooltips.FullPage"),
|
||||||
|
srcRest: resolveUrl(this.urlPrefix, navImages.fullpage.REST),
|
||||||
|
srcGroup: resolveUrl(this.urlPrefix, navImages.fullpage.GROUP),
|
||||||
|
srcHover: resolveUrl(this.urlPrefix, navImages.fullpage.HOVER),
|
||||||
|
srcDown: resolveUrl(this.urlPrefix, navImages.fullpage.DOWN),
|
||||||
|
onRelease: onFullPageHandler
|
||||||
|
});
|
||||||
|
|
||||||
|
this._group = new $.ButtonGroup({
|
||||||
|
config: this.config,
|
||||||
|
buttons: [ zoomIn, zoomOut, goHome, fullPage ]
|
||||||
|
});
|
||||||
|
|
||||||
|
this.navControl = this._group.element;
|
||||||
|
this.navControl[ $.SIGNAL ] = true; // hack to get our controls to fade
|
||||||
|
this.addHandler( 'open', $.delegate( this, lightUp ) );
|
||||||
|
|
||||||
if ( this.config.showNavigationControl ) {
|
if ( this.config.showNavigationControl ) {
|
||||||
this.navControl = (new $.NavControl(this)).elmt;
|
|
||||||
this.navControl.style.marginRight = "4px";
|
this.navControl.style.marginRight = "4px";
|
||||||
this.navControl.style.marginBottom = "4px";
|
this.navControl.style.marginBottom = "4px";
|
||||||
this.addControl(this.navControl, $.ControlAnchor.BOTTOM_RIGHT);
|
this.addControl(this.navControl, $.ControlAnchor.BOTTOM_RIGHT);
|
||||||
@ -719,6 +792,88 @@ function getControlIndex( viewer, elmt ) {
|
|||||||
///////////////////////////////////////////////////////////////////////////////
|
///////////////////////////////////////////////////////////////////////////////
|
||||||
|
|
||||||
|
|
||||||
|
///////////////////////////////////////////////////////////////////////////////
|
||||||
|
// Navigation Controls
|
||||||
|
///////////////////////////////////////////////////////////////////////////////
|
||||||
|
|
||||||
|
function resolveUrl( prefix, url ) {
|
||||||
|
return prefix ? prefix + url : url;
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
function beginZoomingIn() {
|
||||||
|
this._lastZoomTime = +new Date();
|
||||||
|
this._zoomFactor = this.config.zoomPerSecond;
|
||||||
|
this._zooming = true;
|
||||||
|
scheduleZoom( this );
|
||||||
|
}
|
||||||
|
|
||||||
|
function beginZoomingOut() {
|
||||||
|
this._lastZoomTime = +new Date();
|
||||||
|
this._zoomFactor = 1.0 / this.config.zoomPerSecond;
|
||||||
|
this._zooming = true;
|
||||||
|
scheduleZoom( this );
|
||||||
|
}
|
||||||
|
|
||||||
|
function endZooming() {
|
||||||
|
this._zooming = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
function scheduleZoom( viewer ) {
|
||||||
|
window.setTimeout($.delegate(viewer, doZoom), 10);
|
||||||
|
}
|
||||||
|
|
||||||
|
function doZoom() {
|
||||||
|
if (this._zooming && this.viewport) {
|
||||||
|
var currentTime = +new Date();
|
||||||
|
var deltaTime = currentTime - this._lastZoomTime;
|
||||||
|
var adjustedFactor = Math.pow(this._zoomFactor, deltaTime / 1000);
|
||||||
|
|
||||||
|
this.viewport.zoomBy(adjustedFactor);
|
||||||
|
this.viewport.applyConstraints();
|
||||||
|
this._lastZoomTime = currentTime;
|
||||||
|
scheduleZoom( this );
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
function doSingleZoomIn() {
|
||||||
|
if (this.viewport) {
|
||||||
|
this._zooming = false;
|
||||||
|
this.viewport.zoomBy(
|
||||||
|
this.config.zoomPerClick / 1.0
|
||||||
|
);
|
||||||
|
this.viewport.applyConstraints();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
function doSingleZoomOut() {
|
||||||
|
if (this.viewport) {
|
||||||
|
this._zooming = false;
|
||||||
|
this.viewport.zoomBy(
|
||||||
|
1.0 / this.config.zoomPerClick
|
||||||
|
);
|
||||||
|
this.viewport.applyConstraints();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
function lightUp() {
|
||||||
|
this._group.emulateEnter();
|
||||||
|
this._group.emulateExit();
|
||||||
|
};
|
||||||
|
|
||||||
|
function onHome() {
|
||||||
|
if (this.viewport) {
|
||||||
|
this.viewport.goHome();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
function onFullPage() {
|
||||||
|
this.setFullPage( !this.isFullPage() );
|
||||||
|
this._group.emulateExit(); // correct for no mouseout event on change
|
||||||
|
|
||||||
|
if (this.viewport) {
|
||||||
|
this.viewport.applyConstraints();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
}( OpenSeadragon ));
|
}( OpenSeadragon ));
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user