mirror/openseadragon
1
0
Fork 0
mirror of https://github.com/openseadragon/openseadragon.git synced 2025-02-20 16:53:14 +03:00
Code Issues Projects Releases Wiki Activity

Merge remote-tracking branch 'upstream/master'

Browse Source
This commit is contained in:
thejohnhoffer 2016-11-02 19:00:57 -04:00
commit c5d4e9f049
7 changed files with 73 additions and 76 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
changelog.txt
View File

@ -4,6 +4,7 @@ OPENSEADRAGON CHANGELOG
2.2.2: (in progress)
* BREAKING CHANGE: Tile.distance has been removed (#1027)
* You can now set the rotation of individual tiled images (#1006)
* Fixed CORS bug in IE 10 (#967)
* Added support for commonjs (#984)
* Added an option to addTiledImage to change the crossOriginPolicy (#981)
@ -16,6 +17,9 @@ OPENSEADRAGON CHANGELOG
* Fixed problem with "sparse image" DZI files (#995)
* Optimization: Use the squared distance when comparing tiles (#1027)
* Fix IndexSizeError on IE and Edge that occurred under certain circumstances (e.g. multi-image with transparency) (#1035)
* ImageTileSource now works in IE8 (#1041)
* LegacyTileSource now allows any image URLs regardless of type (#1056)
* Fixed error in IE8 when zooming in (due to edge smoothing) (#1064)
2.2.1:

26
src/drawer.js
View File

@ -323,7 +323,6 @@ $.Drawer.prototype = {
this.sketchCanvas.height = sketchCanvasSize.y;
this.sketchContext = this.sketchCanvas.getContext( "2d" );
// FIXME: should check if any tiled image get rotated as well.
// If the viewport is not currently rotated, the sketchCanvas
// will have the same size as the main canvas. However, if
// the viewport get rotated later on, we will need to resize it.
@ -495,13 +494,14 @@ $.Drawer.prototype = {
context.fillStyle = this.debugGridColor;
if ( this.viewport.degrees !== 0 ) {
this._offsetForRotation(this.viewport.degrees);
this._offsetForRotation({degrees: this.viewport.degrees});
}
if (tiledImage.getRotation() !== 0) {
this._offsetForRotation(
tiledImage.getRotation(),
tiledImage.viewport.pixelFromPointNoRotate(
tiledImage._getRotationPoint(true), true));
this._offsetForRotation({
degrees: tiledImage.getRotation(),
point: tiledImage.viewport.pixelFromPointNoRotate(
tiledImage._getRotationPoint(true), true)
});
}
context.strokeRect(
@ -606,13 +606,16 @@ $.Drawer.prototype = {
},
// private
_offsetForRotation: function(degrees, point, useSketch) {
point = point || this.getCanvasCenter();
var context = this._getContext(useSketch);
_offsetForRotation: function(options) {
var point = options.point ?
options.point.times($.pixelDensityRatio) :
this.getCanvasCenter();
var context = this._getContext(options.useSketch);
context.save();
context.translate(point.x, point.y);
context.rotate(Math.PI / 180 * degrees);
context.rotate(Math.PI / 180 * options.degrees);
context.translate(-point.x, -point.y);
},
@ -635,8 +638,7 @@ $.Drawer.prototype = {
// private
_calculateSketchCanvasSize: function() {
var canvasSize = this._calculateCanvasSize();
if (this.viewport.getRotation() === 0 &&
!this.viewer.world._hasRotatedItem()) {
if (this.viewport.getRotation() === 0) {
return canvasSize;
}
// If the viewport is rotated, we need a larger sketch canvas in order

16
src/imagetilesource.js
View File

@ -114,8 +114,9 @@
}
$.addEvent(image, 'load', function () {
_this.width = image.naturalWidth;
_this.height = image.naturalHeight;
/* IE8 fix since it has no naturalWidth and naturalHeight */
_this.width = Object.prototype.hasOwnProperty.call(image, 'naturalWidth') ? image.naturalWidth : image.width;
_this.height = Object.prototype.hasOwnProperty.call(image, 'naturalHeight') ? image.naturalHeight : image.height;
_this.aspectRatio = _this.width / _this.height;
_this.dimensions = new $.Point(_this.width, _this.height);
_this._tileWidth = _this.width;
@ -202,8 +203,9 @@
_buildLevels: function () {
var levels = [{
url: this._image.src,
width: this._image.naturalWidth,
height: this._image.naturalHeight
/* IE8 fix since it has no naturalWidth and naturalHeight */
width: Object.prototype.hasOwnProperty.call(this._image, 'naturalWidth') ? this._image.naturalWidth : this._image.width,
height: Object.prototype.hasOwnProperty.call(this._image, 'naturalHeight') ? this._image.naturalHeight : this._image.height
}];
if (!this.buildPyramid || !$.supportsCanvas || !this.useCanvas) {
@ -212,8 +214,10 @@
return levels;
}
var currentWidth = this._image.naturalWidth;
var currentHeight = this._image.naturalHeight;
/* IE8 fix since it has no naturalWidth and naturalHeight */
var currentWidth = Object.prototype.hasOwnProperty.call(this._image, 'naturalWidth') ? this._image.naturalWidth : this._image.width;
var currentHeight = Object.prototype.hasOwnProperty.call(this._image, 'naturalHeight') ? this._image.naturalHeight : this._image.height;
var bigCanvas = document.createElement("canvas");
var bigContext = bigCanvas.getContext("2d");

7
src/legacytilesource.js
View File

@ -204,12 +204,7 @@ function filterFiles( files ){
file = files[ i ];
if( file.height &&
file.width &&
file.url && (
file.url.toLowerCase().match(/^.*\.(png|jpg|jpeg|gif)(?:\?.*)?$/) || (
file.mimetype &&
file.mimetype.toLowerCase().match(/^.*\/(png|jpg|jpeg|gif)$/)
)
) ){
file.url ){
//This is sufficient to serve as a level
filtered.push({
url: file.url,

75
src/tiledimage.js
View File

@ -550,20 +550,8 @@ $.extend($.TiledImage.prototype, $.EventSource.prototype, /** @lends OpenSeadrag
},
// private
// Convert rectangle in tiled image coordinates to viewport coordinates.
_tiledImageToViewportRectangle: function(rect) {
var scale = this._scaleSpring.current.value;
return new $.Rect(
rect.x * scale + this._xSpring.current.value,
rect.y * scale + this._ySpring.current.value,
rect.width * scale,
rect.height * scale,
rect.degrees)
.rotate(this.getRotation(), this._getRotationPoint(true));
},
// private
// Convert rectangle in viewport coordinates to tiled image coordinates.
// Convert rectangle in viewport coordinates to this tiled image point
// coordinates (x in [0, 1] and y in [0, aspectRatio])
_viewportToTiledImageRectangle: function(rect) {
var scale = this._scaleSpring.current.value;
rect = rect.rotate(-this.getRotation(), this._getRotationPoint(true));
@ -959,7 +947,7 @@ $.extend($.TiledImage.prototype, $.EventSource.prototype, /** @lends OpenSeadrag
var targetRenderPixelRatio = viewport.deltaPixelsFromPointsNoRotate(
this.source.getPixelRatio(level),
false
).x * this._scaleSpring.current.value; //TODO: shouldn't that be target.value?
).x * this._scaleSpring.current.value;
var targetZeroRatio = viewport.deltaPixelsFromPointsNoRotate(
this.source.getPixelRatio(
@ -969,7 +957,7 @@ $.extend($.TiledImage.prototype, $.EventSource.prototype, /** @lends OpenSeadrag
)
),
false
).x * this._scaleSpring.current.value; //TODO: shouldn't that be target.value?
).x * this._scaleSpring.current.value;
var optimalRatio = this.immediateRender ? 1 : targetZeroRatio;
var levelOpacity = Math.min(1, (currentRenderPixelRatio - 0.5) / 0.5);
@ -1058,16 +1046,12 @@ function updateLevel(tiledImage, haveDrawn, drawLevel, level, levelOpacity,
resetCoverage(tiledImage.coverage, level);
if (tiledImage.wrapHorizontal) {
topLeftTile.x -= 1; // left invisible column (othervise we will have empty space after scroll at left)
} else {
if (!tiledImage.wrapHorizontal) {
// Adjust for floating point error
topLeftTile.x = Math.max(topLeftTile.x, 0);
bottomRightTile.x = Math.min(bottomRightTile.x, numberOfTiles.x - 1);
}
if (tiledImage.wrapVertical) {
topLeftTile.y -= 1; // top invisible row (othervise we will have empty space after scroll at top)
} else {
if (!tiledImage.wrapVertical) {
// Adjust for floating point error
topLeftTile.y = Math.max(topLeftTile.y, 0);
bottomRightTile.y = Math.min(bottomRightTile.y, numberOfTiles.y - 1);
@ -1078,11 +1062,14 @@ function updateLevel(tiledImage, haveDrawn, drawLevel, level, levelOpacity,
for (var x = topLeftTile.x; x <= bottomRightTile.x; x++) {
for (var y = topLeftTile.y; y <= bottomRightTile.y; y++) {
var tileBounds = tiledImage.source.getTileBounds(level, x, y);
if (drawArea.intersection(tileBounds) === null) {
// This tile is outside of the viewport, no need to draw it
continue;
// Optimisation disabled with wrapping because getTileBounds does not
// work correctly with x and y outside of the number of tiles
if (!tiledImage.wrapHorizontal && !tiledImage.wrapVertical) {
var tileBounds = tiledImage.source.getTileBounds(level, x, y);
if (drawArea.intersection(tileBounds) === null) {
// This tile is outside of the viewport, no need to draw it
continue;
}
}
best = updateTile(
@ -1544,7 +1531,9 @@ function drawTiles( tiledImage, lastDrawn ) {
var zoom = tiledImage.viewport.getZoom(true);
var imageZoom = tiledImage.viewportToImageZoom(zoom);
if (imageZoom > tiledImage.smoothTileEdgesMinZoom && !tiledImage.iOSDevice) {
// TODO: support tile edge smoothing with tiled image rotation.
if (imageZoom > tiledImage.smoothTileEdgesMinZoom && !tiledImage.iOSDevice &&
tiledImage.getRotation() === 0 && $.supportsCanvas) {
// When zoomed in a lot (>100%) the tile edges are visible.
// So we have to composite them at ~100% and scale them up together.
// Note: Disabled on iOS devices per default as it causes a native crash
@ -1572,15 +1561,18 @@ function drawTiles( tiledImage, lastDrawn ) {
// avoid interpolation
if (!sketchScale) {
if (tiledImage.viewport.degrees !== 0) {
tiledImage._drawer._offsetForRotation(
tiledImage.viewport.degrees, useSketch);
tiledImage._drawer._offsetForRotation({
degrees: tiledImage.viewport.degrees,
useSketch: useSketch
});
}
if (tiledImage._degrees !== 0) {
tiledImage._drawer._offsetForRotation(
tiledImage._degrees,
tiledImage.viewport.pixelFromPointNoRotate(
tiledImage._drawer._offsetForRotation({
degrees: tiledImage._degrees,
point: tiledImage.viewport.pixelFromPointNoRotate(
tiledImage._getRotationPoint(true), true),
useSketch);
useSketch: useSketch
});
}
}
@ -1662,15 +1654,18 @@ function drawTiles( tiledImage, lastDrawn ) {
if (useSketch) {
if (sketchScale) {
if (tiledImage.viewport.degrees !== 0) {
tiledImage._drawer._offsetForRotation(
tiledImage.viewport.degrees, false);
tiledImage._drawer._offsetForRotation({
degrees: tiledImage.viewport.degrees,
useSketch: false
});
}
if (tiledImage._degrees !== 0) {
tiledImage._drawer._offsetForRotation(
tiledImage._degrees,
tiledImage.viewport.pixelFromPointNoRotate(
tiledImage._drawer._offsetForRotation({
degrees: tiledImage._degrees,
point: tiledImage.viewport.pixelFromPointNoRotate(
tiledImage._getRotationPoint(true), true),
false);
useSketch: false
});
}
}
tiledImage._drawer.blendSketch({

11
src/tilesource.js
View File

@ -346,10 +346,17 @@ $.TileSource.prototype = {
*/
getTileAtPoint: function(level, point) {
var widthScaled = this.dimensions.x * this.getLevelScale(level);
var pixelX = point.x * widthScaled;
var pixelY = point.y * widthScaled;
var pixelX = $.positiveModulo(point.x, 1) * widthScaled;
var pixelY = $.positiveModulo(point.y, 1 / this.aspectRatio) * widthScaled;
var x = Math.floor(pixelX / this.getTileWidth());
var y = Math.floor(pixelY / this.getTileHeight());
// Fix for wrapping
var numTiles = this.getNumTiles(level);
x += numTiles.x * Math.floor(point.x);
y += numTiles.y * Math.floor(point.y * this.aspectRatio);
return new $.Point(x, y);
},

10
src/world.js
View File

@ -436,16 +436,6 @@ $.extend( $.World.prototype, $.EventSource.prototype, /** @lends OpenSeadragon.W
* @property {?Object} userData - Arbitrary subscriber-defined object.
*/
this.raiseEvent( 'remove-item', { item: item } );
},
// private
_hasRotatedItem: function() {
for (var i = 0; i < this._items.length; i++) {
if (this._items[i].getRotation() !== 0) {
return true;
}
}
return false;
}
});