mirror of
https://github.com/openseadragon/openseadragon.git
synced 2024-11-22 05:06:09 +03:00
Merge pull request #488 from openseadragon/ian
WIP: collections plus navigator
This commit is contained in:
Ian Gilman
commit
817536929d
@ -216,15 +216,42 @@ $.Navigator = function( options ){
|
||||
unneededElement.parentNode.removeChild(unneededElement);
|
||||
}
|
||||
|
||||
if (options.navigatorRotate)
|
||||
{
|
||||
if (options.navigatorRotate) {
|
||||
options.viewer.addHandler("rotate", function (args) {
|
||||
_setTransformRotate(_this.displayRegionContainer, args.degrees);
|
||||
_setTransformRotate(_this.displayRegion, -args.degrees);
|
||||
_this.viewport.setRotation(args.degrees);
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
this.addHandler("reset-size", function() {
|
||||
if (_this.viewport) {
|
||||
_this.viewport.goHome(true);
|
||||
}
|
||||
});
|
||||
|
||||
this.addHandler("reset-size", function() {
|
||||
if (_this.viewport) {
|
||||
_this.viewport.goHome(true);
|
||||
}
|
||||
});
|
||||
|
||||
viewer.world.addHandler("item-index-changed", function(event) {
|
||||
var item = _this.world.getItemAt(event.previousIndex);
|
||||
_this.world.setItemIndex(item, event.newIndex);
|
||||
});
|
||||
|
||||
viewer.world.addHandler("remove-item", function(event) {
|
||||
var count = _this.world.getItemCount();
|
||||
var item;
|
||||
for (var i = 0; i < count; i++) {
|
||||
item = _this.world.getItemAt(i);
|
||||
if (item._originalForNavigator === event.item) {
|
||||
_this.world.removeItem(item);
|
||||
break;
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
$.extend( $.Navigator.prototype, $.EventSource.prototype, $.Viewer.prototype, /** @lends OpenSeadragon.Navigator.prototype */{
|
||||
@ -313,7 +340,16 @@ $.extend( $.Navigator.prototype, $.EventSource.prototype, $.Viewer.prototype, /*
|
||||
|
||||
},
|
||||
|
||||
open: function( source ) {
|
||||
/**
|
||||
* Overrides Viewer.open
|
||||
* @private
|
||||
*/
|
||||
open: function(source, options) {
|
||||
var _this = this;
|
||||
|
||||
var original = options.originalTiledImage;
|
||||
delete options.original;
|
||||
|
||||
this.updateSize();
|
||||
var containerSize = this.viewer.viewport.containerSize.times( this.sizeRatio );
|
||||
var ts = source.getTileSize(source.maxLevel);
|
||||
@ -322,9 +358,31 @@ $.extend( $.Navigator.prototype, $.EventSource.prototype, $.Viewer.prototype, /*
|
||||
} else {
|
||||
this.minPixelRatio = this.viewer.minPixelRatio;
|
||||
}
|
||||
return $.Viewer.prototype.open.apply( this, [ source ] );
|
||||
}
|
||||
|
||||
this.addHandler('open', function openHandler() {
|
||||
_this.removeHandler(openHandler);
|
||||
_this.world.getItemAt(0)._originalForNavigator = original;
|
||||
});
|
||||
|
||||
return $.Viewer.prototype.open.apply( this, [source, options] );
|
||||
},
|
||||
|
||||
/**
|
||||
* Overrides Viewer.addTiledImage
|
||||
* @private
|
||||
*/
|
||||
addTiledImage: function(options) {
|
||||
var original = options.originalTiledImage;
|
||||
delete options.original;
|
||||
|
||||
var optionsClone = $.extend({}, options, {
|
||||
success: function(item) {
|
||||
item._originalForNavigator = original;
|
||||
}
|
||||
});
|
||||
|
||||
return $.Viewer.prototype.addTiledImage.apply(this, [optionsClone]);
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
|
||||
@ -409,6 +409,26 @@ $.Viewer = function( options ) {
|
||||
this.bindStandardControls();
|
||||
this.bindSequenceControls();
|
||||
|
||||
this.world = new $.World({
|
||||
viewer: this
|
||||
});
|
||||
|
||||
this.world.addHandler('add-item', function(event) {
|
||||
if (_this.viewport) {
|
||||
_this.viewport.setHomeBounds(_this.world.getHomeBounds(), _this.world.getContentFactor());
|
||||
}
|
||||
|
||||
THIS[ _this.hash ].forceRedraw = true;
|
||||
});
|
||||
|
||||
this.world.addHandler('remove-item', function(event) {
|
||||
if (_this.viewport) {
|
||||
_this.viewport.setHomeBounds(_this.world.getHomeBounds(), _this.world.getContentFactor());
|
||||
}
|
||||
|
||||
THIS[ _this.hash ].forceRedraw = true;
|
||||
});
|
||||
|
||||
if ( initialTileSource ) {
|
||||
this.open( initialTileSource );
|
||||
|
||||
@ -544,7 +564,8 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
|
||||
|
||||
this.source = null;
|
||||
this.drawer = null;
|
||||
this.world = null;
|
||||
|
||||
this.world.removeAll();
|
||||
|
||||
this.viewport = this.preserveViewport ? this.viewport : null;
|
||||
|
||||
@ -1046,6 +1067,8 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
|
||||
* @param {Number} [options.y=0] The Y position for the image in world coordinates.
|
||||
* @param {Number} [options.width=1] The width for the image in world coordinates.
|
||||
* @param {Number} [options.height] The height for the image in world coordinates.
|
||||
* @param {Function} [options.success] A function that gets called when the image is
|
||||
* successfully added. It's passed a single parameter: the resulting TiledImage.
|
||||
* @fires OpenSeadragon.World.event:add-item
|
||||
* @fires OpenSeadragon.Viewer.event:add-item-failed
|
||||
*/
|
||||
@ -1112,6 +1135,19 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
|
||||
_this.world.addItem( tiledImage, {
|
||||
index: options.index
|
||||
});
|
||||
|
||||
if (_this.navigator) {
|
||||
var optionsClone = $.extend({}, options, {
|
||||
originalTiledImage: tiledImage,
|
||||
tileSource: tileSource
|
||||
});
|
||||
|
||||
_this.navigator.addTiledImage(optionsClone);
|
||||
}
|
||||
|
||||
if (options.success) {
|
||||
options.success(tiledImage);
|
||||
}
|
||||
}, function( event ) {
|
||||
event.options = options;
|
||||
raiseAddItemFailed(event);
|
||||
@ -1888,20 +1924,6 @@ function openTileSource( viewer, source, options ) {
|
||||
maxImageCacheCount: _this.maxImageCacheCount
|
||||
});
|
||||
|
||||
_this.world = new $.World({
|
||||
viewer: _this
|
||||
});
|
||||
|
||||
_this.world.addHandler('add-item', function(event) {
|
||||
_this.viewport.setHomeBounds(_this.world.getHomeBounds(), _this.world.getContentFactor());
|
||||
THIS[ _this.hash ].forceRedraw = true;
|
||||
});
|
||||
|
||||
_this.world.addHandler('remove-item', function(event) {
|
||||
_this.viewport.setHomeBounds(_this.world.getHomeBounds(), _this.world.getContentFactor());
|
||||
THIS[ _this.hash ].forceRedraw = true;
|
||||
});
|
||||
|
||||
_this.drawer = new $.Drawer({
|
||||
viewer: _this,
|
||||
viewport: _this.viewport,
|
||||
@ -1956,9 +1978,7 @@ function openTileSource( viewer, source, options ) {
|
||||
if ( _this.showNavigator && !_this.collectionMode ){
|
||||
// Note: By passing the fully parsed source, the navigator doesn't
|
||||
// have to load it again.
|
||||
if ( _this.navigator ) {
|
||||
_this.navigator.open( source );
|
||||
} else {
|
||||
if (!_this.navigator) {
|
||||
_this.navigator = new $.Navigator({
|
||||
id: _this.navigatorId,
|
||||
position: _this.navigatorPosition,
|
||||
@ -1969,13 +1989,18 @@ function openTileSource( viewer, source, options ) {
|
||||
width: _this.navigatorWidth,
|
||||
height: _this.navigatorHeight,
|
||||
autoResize: _this.navigatorAutoResize,
|
||||
tileSources: source,
|
||||
tileHost: _this.tileHost,
|
||||
prefixUrl: _this.prefixUrl,
|
||||
viewer: _this,
|
||||
navigatorRotate: _this.navigatorRotate
|
||||
});
|
||||
}
|
||||
|
||||
var optionsClone = $.extend({}, options, {
|
||||
originalTiledImage: tiledImage
|
||||
});
|
||||
|
||||
_this.navigator.open(source, optionsClone);
|
||||
}
|
||||
|
||||
//Instantiate a referencestrip if configured
|
||||
|
||||
47
src/world.js
47
src/world.js
@ -51,6 +51,7 @@ $.World = function( options ) {
|
||||
|
||||
this.viewer = options.viewer;
|
||||
this._items = [];
|
||||
this._needsUpdate = false;
|
||||
this._figureSizes();
|
||||
};
|
||||
|
||||
@ -74,6 +75,7 @@ $.extend( $.World.prototype, $.EventSource.prototype, /** @lends OpenSeadragon.W
|
||||
}
|
||||
|
||||
this._figureSizes();
|
||||
this._needsUpdate = true;
|
||||
|
||||
/**
|
||||
* Raised when an item is added to the World.
|
||||
@ -139,6 +141,7 @@ $.extend( $.World.prototype, $.EventSource.prototype, /** @lends OpenSeadragon.W
|
||||
|
||||
this._items.splice( oldIndex, 1 );
|
||||
this._items.splice( index, 0, item );
|
||||
this._needsUpdate = true;
|
||||
|
||||
/**
|
||||
* Raised when the order of the indexes has been changed.
|
||||
@ -175,17 +178,24 @@ $.extend( $.World.prototype, $.EventSource.prototype, /** @lends OpenSeadragon.W
|
||||
|
||||
this._items.splice( index, 1 );
|
||||
this._figureSizes();
|
||||
this._needsUpdate = true;
|
||||
this._raiseRemoveItem(item);
|
||||
},
|
||||
|
||||
/**
|
||||
* Raised when a item is removed.
|
||||
* @event remove-item
|
||||
* @memberOf OpenSeadragon.World
|
||||
* @type {object}
|
||||
* @property {OpenSeadragon.World} eventSource - A reference to the World which raised the event.
|
||||
* @property {OpenSeadragon.TiledImage} item - The item's underlying item.
|
||||
* @property {?Object} userData - Arbitrary subscriber-defined object.
|
||||
* Remove all items.
|
||||
* @function
|
||||
* @fires OpenSeadragon.World.event:remove-item
|
||||
*/
|
||||
this.raiseEvent( 'remove-item', { item: item } );
|
||||
removeAll: function() {
|
||||
var removedItems = this._items;
|
||||
this._items = [];
|
||||
this._figureSizes();
|
||||
this._needsUpdate = true;
|
||||
|
||||
for (var i = 0; i < removedItems.length; i++) {
|
||||
this._raiseRemoveItem(removedItems[i]);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
@ -206,6 +216,8 @@ $.extend( $.World.prototype, $.EventSource.prototype, /** @lends OpenSeadragon.W
|
||||
for ( var i = 0; i < this._items.length; i++ ) {
|
||||
this._items[i].update();
|
||||
}
|
||||
|
||||
this._needsUpdate = false;
|
||||
},
|
||||
|
||||
/**
|
||||
@ -218,7 +230,7 @@ $.extend( $.World.prototype, $.EventSource.prototype, /** @lends OpenSeadragon.W
|
||||
return true;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
return this._needsUpdate;
|
||||
},
|
||||
|
||||
/**
|
||||
@ -270,6 +282,23 @@ $.extend( $.World.prototype, $.EventSource.prototype, /** @lends OpenSeadragon.W
|
||||
this._homeBounds = new $.Rect( left, top, right - left, bottom - top );
|
||||
this._contentSize = new $.Point(this._homeBounds.width * this._contentFactor,
|
||||
this._homeBounds.height * this._contentFactor);
|
||||
},
|
||||
|
||||
/**
|
||||
* @function
|
||||
* @private
|
||||
*/
|
||||
_raiseRemoveItem: function(item) {
|
||||
/**
|
||||
* Raised when a item is removed.
|
||||
* @event remove-item
|
||||
* @memberOf OpenSeadragon.World
|
||||
* @type {object}
|
||||
* @property {OpenSeadragon.World} eventSource - A reference to the World which raised the event.
|
||||
* @property {OpenSeadragon.TiledImage} item - The item's underlying item.
|
||||
* @property {?Object} userData - Arbitrary subscriber-defined object.
|
||||
*/
|
||||
this.raiseEvent( 'remove-item', { item: item } );
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
@ -9,12 +9,12 @@
|
||||
this.viewer = OpenSeadragon( {
|
||||
debugMode: true,
|
||||
zoomPerScroll: 1.02,
|
||||
// showNavigator: true,
|
||||
showNavigator: true,
|
||||
id: "contentDiv",
|
||||
prefixUrl: "../../../build/openseadragon/images/"
|
||||
} );
|
||||
|
||||
this.gridTest();
|
||||
this.crossTest();
|
||||
},
|
||||
|
||||
// ----------
|
||||
@ -87,6 +87,15 @@
|
||||
y: 0,
|
||||
width: 1
|
||||
});
|
||||
},
|
||||
|
||||
// ----------
|
||||
bigTest: function() {
|
||||
this.viewer.open("../../data/testpattern.dzi", {
|
||||
x: -2,
|
||||
y: -2,
|
||||
width: 6
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user